Шпаргалка по HTML тэгам (часть 4)

[Leksi Dawn]

09.06.2014 в 17:04

Пишет  La mignonne:

Работа с текстом

Пишем текст с красной строки
а так выглядит обычный )

<p style="text-indent: 40px"><b>Пишем текст с красной строки</b></p>
text-indent: 40px — отступ шириной 40 пикселей


Текст с фиксированной шириной:

То есть вдруг вам нужен узенький текст шириной 200 пикселей )).

<div style="width:200px;">То есть вдруг вам нужен узенький текст шириной 200 пикселей )).</div>


Пишем текст в рамочке справа

Коль я не смог вас позабавить,
Легко вам будет все исправить:
Представьте, будто вы заснули
И перед вами сны мелькнули.

Основной текст будет оптекать рамку
<div style="float:right; margin:6px; padding:6px; border:1px solid #000000; width:250px;"> Коль я не смог вас позабавить, Легко вам будет все исправить: Представьте, будто вы заснули И перед вами сны мелькнули.</div>
float:right; — рамка справа
margin:6px; — внешняя ширина от текста до рамки 6 пикселей
padding:6px; — внутренняя ширина от текста до рамки 6 пикселей
border:1px — ширина рамки 1 пиксель
#000000; — цвет рамки
solid — стиль рамки

Стили рамочек бывают:

solid просто линия. solid

dotted точечки dotted

dashed пунктир dashed

double двойная рамка double

Текст с правого края с выравниванием слева

текст с правого края с выравниванием
слева

<div style="float:right;">текст с правого краю с выравниванием слева</div><br clear=all>

Текст     сохраняет вид, 
                                заданный автором, со всеми пробелами и отступами )

<pre>Текст сохраняет вид, заданный автором, со всеми пробелами и отступами )</pre>

Вертикальную перемотку большого текста

Коль я не смог вас позабавить,
Легко вам будет все исправить:
Представьте, будто вы заснули
И перед вами сны мелькнули.
И вот, плохому представленью,
Как бы пустому сновиденью,
Вы окажите снисхожденье.
Мы будем благодарны ввек.
Притом клянусь, как честный Пэк,
Что если мы вам угодили
И злобных змей не разбудили,
То лучше все пойдет потом.
Давайте руку мне на том.
Коль мы расстанемся друзьями,
В долгу не буду перед вами.

<div style="overflow:auto; height:70px; width:300px; padding:8px; border:1px solid #b2a5e8;">Вставляем текст</div >