Кухня HTML-верстальщика

Начало

Глава 1

Глава 2

Глава 3

Глава 4

Глава 5

Глава 6

Глава 7

Глава 8

Глава 9

Глава 10

Глава 11

Глава 12

Глава 13

Глава 14

Добавить в избранное || Рамки в HTML || Начало || Центрирование по вертикали

4. Выравнивание по центру

Казалось бы, нет ничего сложного, чтобы установить картинку или текст в центре окна браузера. Используем тег CENTER и все становится на то место, куда мы и задумывали. Однако не все так просто. Существует три способа выравнивания по центру, каждый из них имеет свои особенности и отличия в разных браузерах.

Один из самых простых и удобных тегов – CENTER предназначен для выравнивания блока текста. С помощью этого тега также можно центрировать рисунки и таблицы. Исключение составляют элементы <img align=left ...> или <img align=right... > для которых выравнивание задается свойствами тега IMG. Так, если поместить элемент <img align=right... > внутри тега CENTER, рисунок окажется выровненным по правому краю.

Пример 4.1. Центрирование с помощью тега CENTER

<center>
Данный текст будет выровнен по центру окна браузера, а нижележащий
рисунок по правому краю.
<img src=no.gif width=100 height=100 align=right>
</center>

Формально CENTER должен использоваться только как параметр других блочных тегов ( P, PRE и другие). Однако в браузере Netscape Navigator 2.0 CENTER был введен как самостоятельный тег. Это дополнение было призвано убрать лишний вертикальный отступ, который появляется при использовании блочных тегов. Если вместо тега CENTER текст поместить внутрь параграфа (<p align="center">), появляется дополнительный вертикальный отступ между горизонтальной линией и этим текстом.

CENTER не входит в спецификацию HTML. В «официальном» HTML форматирование, такое как выравнивание текста должно производится через атрибуты тегов (например, <p align="center">) или с использованием стилей. Тем не менее, этот тег обрел право на существование. Однако после опубликования спецификации HTML 4 W3 Консорциум рекомендовал воздержаться от использования тега CENTER, а вместо него использовать элемент <div align="center">... </div>, как показано в примере 4.2.

Пример 4.2. Центрирование с помощью тега DIV

<hr>
<div align = “center”>
Выравнивание текста по центру с помощью тега DIV
</div>
</hr>

Еще один способ центрирования заключается в использовании стилей. Стили представляют собой инструкции, которые позволяют управлять атрибутами форматирования как шрифт, цвет, выравнивание и др. Пример переопределения тега P для центрирования текста.

Пример 4.3. Центрирование с помощью стилей

<html>
<head>
<style type="text/css">
P { text-align: center; }
</style>
</head>
<body>
<p>Теперь, когда вы будете использовать тег P с вышеуказанным
стилем, текст параграфа будет выровнен по центру окна браузера </p>
</body>
</html>

Для установки текста по центру используется параметр text-align: center.

Добавить в избранное || Рамки в HTML || Начало || Центрирование по вертикали

top

графика, хтмл, для, начинающий, начинающих, чайников, новичков, просто, основа, основы, графика, страница, домашний, домашняя, сайт, новый, новичок, html, обучение, учеба, пример, веб, мастер, веб-мастер, дизайн, веб-дизайн, вебдизайн, дезайн, веб-дезайн, вебдезайн, дезайнер, дизайнер, ступени, тэги, тэг, теги, тег, аттрибут, атрибуты, парамет, design, web, help, помощь, icq, e-mail, guest, book, guestbook, гостевая, книга, форум, аська, контакт, ссылка, link, links, banner, обмен, баннер, баннерами, банер, baner, друзья, friends, почитать, написать, вопросы, вопрос, ответ, проект, ступени, словарь

Используются технологии uCoz