Элементарно о тегах оформления

Вторник, 22 Декабря 2009 г. 18:56 + в цитатник

Цитата сообщения

Прочитать целиком В свой цитатник или сообщество!

Жирный текст

Текст курсивом

Подчеркнутый текст

Мааахонький текст ;)

~~Зачеркнутый текст~~

Простой текст и Здесь всплывающая подсказка

Размер шрифта +1

Размер шрифта +2

Размер шрифта +3

Размер +4

Текст _{Сноской} внизу

Ваш текст

Текст ^{Сноской} вверху

ТЕКСТ

Цитата с отступом

<blockquote> ВАШ текст</blockquote>

Текст (или картинка) по центру

<center>ВАШ текст</center>

Закрепить текст

<pre>ВАШ текст</pre>

Текст с точкой в начале<ul> <li>ВАШ текст </li></ul>

<left>ВАШ текст слева</left>

Путин едет по стране на серебряном коне
Путин всем людЯм поможет, дай ему здоровья, Боже.
Всех бандитов перебьёт, работягам он нальёт.
Путин едет по стране, а мы по-прежнему в ... (Ю.Шевчук)

<right>ВАШ текст справа</right>

Путин едет по стране на серебряном коне
Путин всем людЯм поможет, дай ему здоровья, Боже.
Всех бандитов перебьёт, работягам он нальёт.
Путин едет по стране, а мы по-прежнему в ... (Ю.Шевчук)

[more=Текст ссылки перехода]То что будет скрыто под катом[/more]

Если ваш пост слишком большой 
можете скрыть часть вашего поста под кат

<pre><ol><br />
<li> первый пункт<br />
</li><li> второй пункт<br />
</li><li> третий пункт<br />
</li></ol></pre>



 первый пункт

 второй пункт

 третий пункт

Раздел таблиц оформления

Точечная рамка

<div style="border:1px dotted  #000;padding:10px;">ВАШ текст</div>

Точечная рамка толщиной +2

<div style="border:2px dotted  #000;padding:10px 10px 10px 10px;">ВАШ текст</div>

Точечная рамка толщиной +3 красная

<div style="border:3px dotted  red;padding:10px 10px 10px 10px;">ВАШ текст</div>

Сплошная рамка

<div style="border:1px double  #000;padding:10px;">ВАШ текст</div>

Сполшная рамка толщиной +2

<div style="border:2px solid  #000;padding:10px 10px 10px 10px;">ВАШ текст</div>

Сполшная рамка толщиной +3 фиолетовая

<div style="border:3px solid  purple;padding:10px 10px 10px 10px;">ВАШ текст</div>

Пунктирная рамка

<div style="border:1px dashed  #000;padding:10px 10px 10px 10px;">ВАШ текст</div>

Пунктирная рамка толщиной +2

<div style="border:2px dashed  #000;padding:10px 10px 10px 10px;">ВАШ текст</div>

Пунктирная рамка толщиной +3 голубая

<div style="border:3px dashed  #A7A7FE;padding:10px 10px 10px 10px;">ВАШ текст</div>

Возвышенный текст

<div style="border:1px inset  #000;padding: 10px;">ВАШ текст</div>

Возвышенный текст толщиной +2

<div style="border:2px inset  #000;padding:10px 10px 10px 10px;">ВАШ текст</div>

Возвышенный текст толщиной +3 цвет фуксия

<div style="border:3px inset  fuchsia;padding:10px 10px 10px 10px;">ВАШ текст</div>

Вдавленный текст

<div style="border:1px outset  #000;padding:10px;">ВАШ текст</div>

Вдавленный текст толщиной +2

<div style="border:2px outset  #000;padding:10px 10px 10px 10px;">ВАШ текст</div>

Вдавленный текст толщиной +3 зеленый

<div style="border:3px outset  #2D8028;padding:10px 10px 10px 10px;">ВАШ текст</div>

<p style="text-indent: 40px">ВАШ ТЕКСТ</p>

Текст который вы тут напишите в начале абзаца будет иметь небольшой отступ, практичесски как во всех правилах книгопечатания;) на всякий случай пишу больше текста чтобы вы поняли о чем идет речь)) Хорошая погода правда? Как у вас дела?)) Кстати этот пост я мучаю уже больше 2 недель, вот так вот, не так уж и просто доходчиво научить вас как оформлять свои посты)

<a href="//www.liveinternet.ru/journal_proc.php?action=redirect&url=ссылка">ЗДЕСЬ ваш текст</a>

ЗДЕСЬ ваш текст, в данном случае ссылка на мой блог ;)

Цветной текст

Красный текст

<font color="red">Текст</font>

Фиолетовый текст

<font color="purple">Текст</font>

Желтый текст

<font color="yellow">Текст</font>

Ядовитый зеленый текст

<font color="lime">Текст</font>

Коричневый текст

<font color="maroon">Текст</font>

Голубой текст

<font color="aqua">Текст</font>

Синий текст

<font color="navy">Текст</font>

Фуксия текст

<font color="fuchsia">текст</font>

Белый текст

<p><span style="color: rgb(255, 255, 255);">Текст</span></p>

Серый текст

<p><span style="color: rgb(192, 192, 192);">Текст</span></p>

Розовый текст

<p><span style="color: rgb(255, 153, 204);">Текст</span></p>

Оранжевый текст

<p><span style="color: rgb(255, 102, 0);">Текст</span></p>

16 основных названий цветов, используемых во всех браузерах. Блок от Rost

Название	Hex	Красный (R)	Зеленый (G)	Синий (B)
aqua	#00FFFF	00	255	255
black	#000000	00	00	00
blue	#0000FF	00	00	255
fuchsia	#FF00FF	255	00	255
gray	#808080	128	128	128
green	#008000	00	128	00
lime	#00FF00	00	255	00
maroon	#800000	128	00	00
navy	#000080	00	00	128
olive	#808000	128	128	00
purple	#800080	128	00	128
red	#FF0000	255	00	00
silver	#C0C0C0	192	192	192
teal	#008080	00	128	128
white	#FFFFFF	255	255	255
yellow	#FFFF00	255	255	00

Немного анимации

<marquee direction="up" scrollamount="1" scrolldelay="0" height="32">ВАШ текст</marquee>

Плавающий текст вверх

<marquee direction="down" scrollamount="1" scrolldelay="0" height="32">ВАШ текст</marquee>

Плавающий текст вниз

<marquee direction="right">ВАШ текст</marquee>

Текст умеющий убегать вправо =)

<marquee>ВАШ текст</marquee>

Текст умеющий убегать влево ;)

<marquee behavior="alternate">ВАШ текст</marquee>

ВАШ текст бегающий от края к краю

А еще, я прилагаю к сему посту, одну очень простую и полезную програмку, с помощью которой можно делать практичесски все тоже самое только в полуавтоматическом режиме. Называется она tagExpress. Она полностью мобильна, ее не нужно устанавливать на ваш компьютер, просто запускаете ее пишите\вставляете в область написания текста то, что вам нужно, и выделив ту часть текста которая вам нужна, нажимайте на тот эффект которого вы хотите достичь, и выделенный вами текст автоматически обретет нужный тег. Посмотреть на то как будет выглядеть результат, можно в ней же перейдя в закладку show. После чего, можете вырезать обработанный текст из закладки edit, и вставлять в свои посты. Программа делалась специально для ЛиРушечки, для ленивых и не очень ;) Программа позволяет быстро, мобильно и удобно все оформлять. Качаем ее по ссылке: tagExpress.rar
Вот как она выглядит:

Если кому что не понятно по этому посту или tagExpress, спрашивайте прямо здесь, не стесняйтесь!

Особая блогодарность Lilumi за нравоучения, наставления, и немалую помощь в оформлении сего поста. Да кстати, этот пост писался почти 3 недели, потрачено масса нервов и труда, надеюсь вы оцените это процитировав постик к себе;) Эти элементарные вещи в оформлении ваших постов, всегда помогут вам выделить и красиво преподнести свои записи, надеюсь что моя работа не прошла даром и пост станет хорошим вашим помошником.
Искренне, Ваш вечный не читатель ©RadioHeads

+ Цитировать

Серия сообщений "ОФОРМЛЕНИЕ дневника":
Часть 1 - Изучаем HTML. Теги. Оформление постов
Часть 2 - Как вставить в блог флэш-анимацию
...
Часть 8 - Онлайн-уроки по дневникам LiveInternet
Часть 9 - Наглядно про теги
Часть 10 - Элементарно о тегах оформления
Часть 11 - Таблица цветов HTML
Часть 12 - Как вставить флеш в пост, узнать прямую ссылку на неё?
...
Часть 38 - Список уроков. Как ОФОРМИТЬ ДНЕВНИК
Часть 39 - Хитрoсти Youtube
Часть 40 - Энциклопедия ЛиРУ