18:34 

Краткая шпаргалка HTML

 Оформление текста: 

<u>Ваш текст</u> -  Ваш текст;

<s>Ваш текст</s> - Ваш текст; 

<b>Ваш текст</b> - Ваш текст;

<i>Ваш текст</i> - Ваш текст; 

        - пробел;

<br/> - перенос по строке вниз;

<center>Текст</center> - текст по центру.

Таблица:

<table border=0 widht=52%> - начало таблицы;

<tr> - начало строки;

</tr> - конец строки;

<td> и </td> - между этими символами заключается одна ячейка таблицы;

</table> - конец таблицы.

  Подробнее о таблицах здесь

  Ссылки:<a href="URL СТРАНИЦЫ"> ВАШ ТЕКСТ</a>

<a href="URL СТРАНИЦЫ"><img src="URL КАРТИНКИ"></a> - кликабельная картинка,


<a href="URL СТРАНИЦЫ" target="_blank">ВАШ ТЕКСТ</a> - ссылка откроется в новом окне.
   подробнее читать здесь

  Окошко для вставки кода:
1.<textarea rows="2" cols="60"> ВАШ КОД </textarea> ,где cols - ширина окошка в px, а rows - число строк в окне.

2.<input size="35" value="Ваш код"h-text"><div class="b-text"
подробнее читать здесь

 Кат текста: <cut text="Читать далее">Основной текст </cut>
подробнее читать здесь

Шрифт, размер, цвет текста: <span style="font-family:Monotype Corsiva;color:fuchsia;font-size:25px">Ваш текст</span>
подробнее читать здесь 

  Кнопка:  

<a href="Ссылка"><input type="submit" value="Надпись на кнопке" /></a>

Обтекание картинки тектом:
 

<img src="http:…" align=left hspace=20 vspace=20>

  Цвета HTML:


 Подробнее о HTML:

Принципы HTMLГотовые кодыШрифты HTMLКрасивый текстЦвета HTMLFlash по цветамТаблица HTMLКопир. изобр-язащита изобр-яредактор HTMLБродилкаПишем на изобр-и


@темы: Редактирование записи, Кодировка, Записи, CSS

12:35 

JavaScript

D Ash
Embrace your dreams and prove your honor...
      
Вот и добрались.
      

      
На самом деле, учитывая написанное выше, идея проста и очевидна. Но не идеальна.
      
Пишем пост в виде HTML с CSS и JS, закидываем его на Dropbox и вписываем в страницу, используя этот гайд. Одно но - вам придётся либо высчитать высоту поста (подогнать её уже после публикации, как вариант), или создать внутри вашего html внешний контейнер (начинающийся сразу после начала body и заканчивающийся непосредственно перед его концом) с параметром overflow:auto (<div style="overflow:auto">ваш текст</div>) - чтобы появились скроллы, если содержимое превысит указанные вами размеры объекта.
      

      
Минус идеи в том, что ни JS, ни CSS не будут работать вне вашего кода, вне фрейма. Так что польза сомнительна, хоть и есть, наверное.
      

      
Я использовал у себя в эпиграфе.

@темы: CSS, Javasсript, Вставка медиа-объектов, Новая запись, Редактирование записи, Теги оформления записи, Эпиграф

10:41 

redString [0.1]

D Ash
Embrace your dreams and prove your honor...

Написал скрипт для Google Chrome, упрощающий создание красных строк в посте. 

Как это работает. 

Вы пишете ваш пост (или комментарий), перед тем как отправить, нажимаете [Alt+R], скрипт модифицирует текст поста, после этого вы можете его опубликовать. Если вам необходимо отредактировать пост, перед тем, как править текст, нажмите [Alt+Q], и все лишние тэги исчезнут из текста. Сами красные строки реализованы через тэги <p> с параметром text-indent:30px. 

 

Несколько замеченных багов
 

Если в вашем посте вы открываете какой-либо тэг в одном абзаце, а закрываете в другом - лучше проставьте этот тэг после нажатия [Alt+R], иначе его работа будет нарушена. 

Не окаймляются div элементы. 

После редактирования пост превращается в кашу, его крайне сложно читать, не сняв красную строку. 

Если при создании поста вы использовали тэги <p>, то при попытке удалить красную строку удалятся также ваши закрывающие </p>. 

 

 


    
upd: Альтернативый вариант. Работает проще, заменяет начало строки на цепочку несжимаемых пробелов. Горячие клавиши те же. Минус метода - в блоках с text-align:justify отступы могут получатся разными (т.е. различно расстояние между пробелами). Зато не появляется ненужной каши и путаницы со вложениями, как и проблем с иерархией. Перед установкой рекомендуется удалить обычный (через меню -> Tools -> Extensions).

    
upd2: Исправил альтернативную, теперь размер отступа везде одинаковый. Ссылку на скачивание обновил.


PS Возможно, чуть позже попробую сделать вариацию для FireFox и других браузеров, а также исправить баги. Пока что так - лучше чем ничего, верно?


запись создана: 12.02.2011 в 07:22

@темы: Javasсript, Новая запись, Редактирование записи, Теги оформления записи

Красный угол

главная