Читайте также: |
|
В этой главе мы поговорим о параграфах. Параграфы вводятся тэгом:
<p></p>
С помощью параграфов мы можем центрировать текст:
<p align="center">текст</p>
С помощью параграфов мы можем выровнять текст по левому краю:
<p align="left">текст</p>
По правому краю документа:
<p align="right">текст</p>
По обоим краям документа:
<p align="justify">текст</p>
Теперь введем параграфы в наш документ и посмотрим наглядно, что получится (в наш пример я подставила параграф с атрибутом центрирования текста (align="center"), попробуйте подставить в параграф атрибут align с другими значениями: Left, Right, Justify).
Кстати, правильно говорить не выравнивание, а выключка: выключка по левому краю, правому, центру, по обоим краям. Если вы позже будете углубляться в область дизайна, то вам наверняка этот термин встретится. Между прочим, HTML не имеет к дизайну ни малейшего отношения, не считайте, что, изучив HTML, вы станете вдруг дизайнером, это большое заблуждение многих начинающих в области сайтостроительства.
<html> <head> <title>Мой первый шаг </title> </head> <body text="#336699" bgcolor="#000000"> <p align="center"> Здравствуйте, это моя первая страница. <br> <font color="#CC0000"> Добро пожаловать!</font>:) </p> </body> </html> (посмотреть) |
Но, вернемся к нашему HTML и параграфам. Запомните: никогда нельзя вводить в документ подобную конструкцию:
<p></p>
Пустые элементы <p> без какого-либо содержания (других тэгов или текста) могут игнорироваться броузерами. Не забывайте это. Заметьте, что текст в документе, если не задавать параграфы, всегда выравнивается по умолчанию по левому краю. Также запомните, что после закрывающего тега </p> автоматически происходит перенос строки. Но что делать, если вам этот перенос никак не нужен? Есть тэг альтернативный <p align="center">:
<center> текст </center>
<html> <head> <title>Мой первый шаг </title> </head> <body text="#336699" bgcolor="#000000"> <center> Здравствуйте, это моя первая страница. <br> <font color="#CC0000"> Добро пожаловать!</font>:) </center> </body> </html> (посмотреть) |
Конечно, тэг <center> хорош, но остался нам он еще с прошлых версий HTML (да, их было несколько, все в этом мире развивается, HTML не исключение). Пока что этот тэг никто не отменял, и его можно использовать, но это не слишком желательно.
Как же лучше поступить? Лучше использовать тэг <div></div>, одно из назначений которого выравнивание содержимого вашего документа. Все четыре значения атрибута align можно употреблять с <div>:
<div align="center"> текст </div>
<div align="left"> текст </div>
<div align="right"> текст </div>
<div align="justify"> текст </div>
<html> <head> <title>Мой первый шаг </title> </head> <body text="#336699" bgcolor="#000000"> <div align="center"> Здравствуйте, это моя первая страница. <br> <font color="#CC0000"> Добро пожаловать!</font>:) </div> <p align="justify"> Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появться еще один виртуальный друг?:) </p> </body> </html> (посмотреть) |
тут набросан примерный текст вступления, вы придумаете, конечно, что-нибудь свое. Но прежде мы завершим наш разговор о <div> и <p>. Параграф не может содержать в себе другие параграфы, и также тэг <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>
Дата добавления: 2015-10-02; просмотров: 32 | Нарушение авторских прав
<== предыдущая страница | | | следующая страница ==> |
Ступенька 5-ая. | | | Ступенька 7-ая. |