Главная страница Содержание Учебник по Html Словарь тегов Гостевая книга Напиши мне

Простейшие.

Ступенька 5 - "Параграфы и DIV. Учимся выравнивать текст".

Текст в документе всегда выравнивается по умолчанию по левому краю. Поэтому если нам необходимо выравнять текст иначе, нужно использовать параграфы. Параграфы вводятся тэгом: <p></p>

С помощью параграфов мы можем:

  • <p align="center">текст</p> - центрировать текст;
  • <p align="left">текст</p> - выравнять текст по левому краю документа;
  • <p align="right">текст</p> - выравнять текст по правому краю документа;
  • <p align="justify">текст</p> - и по обоим краям (ширине) документа.
Теперь поставим в нашем примере названия фирмы по центру и посмотрим наглядно, что получится:
    <html>
    <head>
    <title>Компания News computers</title>
    </head>
    <body text=red bgcolor="#000000">
    <p align="center" > Компания
    <font color="green"> News computers </p>
    </font>
    Мы обеспечим вас компьютерами и программным обеспечением на любой вкус.
    </body>
    </html>     посмотреть
Кстати, правильно говорить не выравнивание, а выключка: выключка по левому краю, правому, центру, по обоим краям. Если вы позже будете углубляться в область дизайна, то вам наверняка этот термин встретится.

Запомните, что после закрывающего тега </p> происходит автоматический перенос строки. Но что делать, если вам этот перенос совсем не нужен? На этот случай есть альтернативный тэг <center> текст </center>

    <html>
    <head>
    <title>Компания News computers</title>
    </head>
    <body text=red bgcolor="#000000">
    <center> Компания
    <font color="green"> News computers </center>
    </font>
    Мы обеспечим вас компьютерами и программным обеспечением на любой вкус.
    </body>
    </html>     посмотреть
Конечно, тэг <center> </center> хорош, но достался он нам еще с прошлых версий HTML. Пока что этот тэг никто не отменял, и его можно использовать, но это не желательно.

Как же поступить? Лучше использовать тэг <div></div> ,одно из назначений которого - выравнивание содержимого вашего документа. Все четыре значения атрибута align можно употреблять с <div>:

  • <div align="center" > текст </div> - по центру
  • <div align="left"> текст </div> - по левому краю
  • <div align="right"> текст </div> - по правому краю
  • <div align="justify"> текст </div> - по ширине
    <html>
    <head>
    <title>Компания News computers</title>
    </head>
    <body text=red bgcolor="#000000">
    <div align="center" > Компания
    <font color="green"> News computers </div>
    </font>
    Мы обеспечим вас компьютерами и программным обеспечением на любой вкус.
    </body>
    </html>     посмотреть
Параграф не может содержать в себе другие параграфы, а также тэг <div></div>. Т.е. следующие конструкции будут не верны, и вводить их в документ нельзя:

<p align="right">
<p>текст</p>
<p>текст</p>
<p>текст</p>
</p>

и

<p align="right">
<div>текст</div>
<p>текст</p>
<div>текст</div>
</p>

Однако <div> может содержать в себе параграфы: с помощью него мы можем сгруппировать их, допустим, по правому краю.

<div align="right">
<p>текст первого абзаца</p>
<p>текст второго абзаца</p>
<p>текст третьего абзаца</p>
</div>

Конечно, <p> и <div> не несут в себе исключительно функцию выравнивания элементов. Но поскольку эта ступенька посвещана только выравниванию, то к другим возможностям использования <div> и <p> мы вернемся гораздо позже.

[ Назад: Ступенька 4-ая ] [ Далее: Ступенька 6-ая ]