Учебник по Html для начинающих. Простейшее.
Параграфы и DIV-вы. Выравнивание текста.
А сейчас мы рассмотрим параграфы. Они вводятся тэгом: <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>
<head>
<title>Мой первый шаг </title>
</head>
<body text="#336699" bgcolor="#000000">
<p align="center">
Здравствуйте, это моя первая страница.
<br>
<font color="#CC0000"> Добро пожаловать!</font> :) </p>
</body>
</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> (посмотреть результат)
Однако на большее этот тег не способен. Он остался еще с прошлых версий HTML (да, их было несколько, все в этом мире развивается, HTML не исключение). Пока что этот тэг никто не отменял, и его можно использовать. Похожих тегов на выравнивание не существует. Поэтому лучше использовать (как альтернативу) тэг <div></div>, одно из назначений которого выравнивание содержимого вашего документа. Все четыре значения атрибута align можно употреблять именно с ним:
- центруем текст: <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> (посмотреть результат)
<p align="right">
<p>текст</p>
<p>текст</p>
<p>текст</p>
</p>
и
<p align="right">
<div>текст</div>
<p>текст</p>
<div>текст</div>
</p>
В отличие от <p></p>, <div></div> может содержать в себе параграфы. Например, с его помощью мы можем сгруппировать параграфы, по правому краю:
<div align="right">
<p>текст первого абзаца</p>
<p>текст второго абзаца</p>
<p>текст третьего абзаца</p>
</div>
<p> и <div> применяются не только для выравнивания элементов. Но поскольку на этой странице мы осваиваем только выравнивание, то к другим возможностям использования <div> и <p> мы вернемся гораздо позже, т.к. это уже более сложная тема для разговора, и Вы пока что к ней не готовы.
<<< Страница 4 :Назад | Далее: Страница 6 >>>