- •1. Общие сведения
- •Структура html-документа и элементы разметки заголовка документа
- •Назначение заголовка
- •Отображение содержания элемента title
- •Основные контейнеры заголовка
- •Элемент разметки head
- •Элемент разметки title
- •Элемент разметки base
- •Элемент разметки isindex
- •Применение элемента isindex
- •Применение атрибута prompt
- •Элемент разметки meta
- •Элемент разметки link
- •Элемент разметки style
- •Элемент разметки script
- •Контейнеры тела документа Теги тела документа
- •Тело документа – контейнер body
- •Теги управления разметкой Заголовки
- •Атрибут аlign
- •Теги управления отображением символов
- •Теги, управляющие формой отображения
- •Верхние и нижние индексы
- •Атрибут sizе
- •Атрибут соlоr
- •Создание списков в html
- •Атрибуты маркеров в ненумерованном списке
- •Комментарии в языке html
- •Гипертекстовые ссылки
- •Графика Использование графики в html
- •Атрибуты и их аргументы
- •Атрибут src
- •Атрибут alt
- •Атрибут аlign
- •Атрибут usemap
- •Средства описания таблиц в html
- •Создание таблиц в html
- •Атрибут nowrap
- •Атрибут соlspan
- •Атрибут rowspan
- •Атрибут widтн
- •Применение пустых ячеек
- •Атрибут сеllраdding
- •Атрибуты аlign и valign
- •Атрибут border
- •Атрибут cellspacing
- •Атрибут bgcolor
- •Атрибут background
- •Использование таблиц в дизайне страницы
- •Создание разноцветных таблиц
- •Html-формы
- •Задание формы — элемент form
- •Атрибут cols
- •Как работают фреймы
- •Создание простой страницы с фреймами
- •Задание фреймовой структуры
- •Подготовка содержимого фрейма
- •Подготовка фрейма main
- •Списки Definition: элементы dl, dt и dd
- •Визуальное представление списков
- •Элементы dir и menu
- •Гиперссылки Гиперссылки и якоря. Введение
- •"Посещение" связанного ресурса
- •Другие соотношения гиперссылок
- •Спецификация якорей и гиперссылок
- •Заголовки гиперссылок
- •Интернационализация и гиперссылки
- •Синтаксис имён якорей
- •Вложение ссылок не допускается
- •Якоря с атрибутом id
- •Недоступные и неидентифицируемые ресурсы
- •Взаимосвязи документов: элемент link
- •Гиперссылки вперёд и назад
- •Гиперссылки и внешние таблицы стилей
- •Гиперссылки и машины поиска
- •Информация пути: элемент base
- •Добавление стиля в html
- •Установка языка по умолчанию для таблиц стилей
- •Инлайн-стиль (внедрённый)
- •Информация о стиле в заголовках: элемент style
- •Типы носителя
- •Внешние таблицы стилей
- •Основные и альтернативные таблицы стилей
- •Спецификация внешней таблицы стилей
- •Каскадные таблицы стилей
- •Media-зависимые каскады
- •Наследование и каскадирование
- •Скрытие данных стиля от пользовательских агентов (па)
- •Ссылки на таблицы стилей в заголовках http
- •Выравнивание, стили шрифта и горизонтальные линии Форматирование Цвет фона
- •Выравнивание
- •Плавающие объекты
- •"Всплывание" объекта
- •Обтекание текста вокруг объекта
- •Элементы стиля шрифта: tt, I, b, big, small, strike, s и u
- •Элементы модификатора шрифта: font и basefont
- •Сценарии (скрипты) Введение
- •Дизайн документов для па, поддерживающих скрипты
- •Элемент script
- •Установка языка скриптов
- •Язык сценариев по умолчанию
- •Локальное объявление языка скриптов
- •Ссылки на элементы html из скрипта
- •Динамическое изменение документов
- •Дизайн документов для па, не поддерживающих сценарии
- •Элемент noscript
- •Скрытие данных скрипта от па
- •Дополнительные возможности html Компоновка документа в html
- •Компоновка html - использование таблиц
- •Использование стилей в html
- •Как использовать стили
- •Внешняя таблица стилей
- •Внутренняя таблица стилей
- •Встроенные стили
- •Раздел заголовка html
- •Элемент head
- •Универсальные указатели ресурсов в html Ссылки в html
- •Универсальные указатели ресурсов
- •Схемы обращения к ресурсу url
- •Сценарии в html
- •Добавление сценария на страницу html
- •Как работать со старыми браузерами
- •Стандартные атрибуты html 4.0
- •Атрибуты событий клавиатуры
- •Атрибуты событий мыши
- •Вы изучили html, что дальше? Краткое заключение
- •Теперь вы знаете html, что дальше?
- •Каскадные таблицы стилей (css)
Выравнивание, стили шрифта и горизонтальные линии Форматирование Цвет фона
Определение атрибута
bgcolor = color [CI]
Не рекомендуется.Этот атрибут устанавливает цвет фона документа или ячеек таблицы.
Этот атрибут устанавливает цвет фона "канвы" тела документа (элемент BODY) или таблицы (элементы TABLE, TR, TH и TD). Дополнительные атрибуты, устанавливающие цвет текста, могут использоваться с элементом BODY.
Этот атрибут не рекомендуется использовать для определения цвета фона. Лучше использовать таблицы стилей.
Выравнивание
Можно выравнивать блок элементов (таблицы, изображения, объекты, параграфы и т.п.) на "канве" с помощью атрибута align. Хотя этот атрибут может быть установлен для многих элементов HTML, диапазон его значений может отличаться, в зависимости от элемента. Здесь мы обсуждаем только значение атрибута "выравнивание" для текста.
Определение атрибута
align = left|center|right|justify [CI]
Не рекомендуется.Этот атрибут определяет горизонтальное выравнивание элемента по отношению к окружающему контексту. Возможные значения:
left: строки текста выравниваются по левому краю;
center: строки текста выравниваются по центру;
right: строки текста выравниваются по правому краю;
justify: строки текста выравниваются по обоим полям.
Значение по умолчанию зависит от базового направления текста. Для направления слева направо - это align=left, для направления справа налево - по умолчанию align=right.
|
НЕ РЕКОМЕНДУЕТСЯ: Здесь заголовок центрируется. <H1 align="center"> Что за прелесть эта мерзость! </H1>
|
Используя CSS (каскадные таблицы стилей), например, Вы можете достичь того же эффекта следующим образом:
<HEAD>
<TITLE>Что за прелесть эта мерзость!</TITLE>
<STYLE type="text/css">
H1 { text-align: center}
</STYLE>
<BODY>
<H1> Что за прелесть эта мерзость! </H1>
Учтите, что это будет действовать на все элементы H1. Вы можете ограничить область видимости стиля, установив атрибут class элемента:
<HEAD>
<TITLE>Что за прелесть эта мерзость!</TITLE>
<STYLE type="text/css">
H1.wood {text-align: center}
</STYLE>
<BODY>
<H1 class="wood"> Что за прелесть эта мерзость! </H1>
|
НЕ РЕКОМЕНДУЕТСЯ: также, для того, чтобы выровнять вправо параграф на "канве" атрибутом HTML align, Вы могли бы записать: <P align="right">...параграф текста...
|
что в таблице стиля могло бы быть:
<HEAD>
<TITLE>Что за прелесть эта мерзость!</TITLE>
<STYLE type="text/css">
P.mypar {text-align: right}
</STYLE>
<BODY>
<P class="mypar">...параграф текста...
|
НЕ РЕКОМЕНДУЕТСЯ: Чтобы выровнять вправо несколько параграфов, сгруппируйте их элементом DIV: <DIV align="right"> <P>...текст первого параграфа... <P>...текст второго параграфа... <P>...текст третьего параграфа... </DIV>
|
В таблице стиля свойство выравнивания текста наследуется от предка, поэтому Вы можете использовать:
<HEAD>
<TITLE>Что за прелесть эта мерзость!</TITLE>
<STYLE type="text/css">
DIV.mypars {text-align: right}
</STYLE>
<BODY>
<DIV class="mypars">
<P>...текст первого параграфа...
<P>...текст второго параграфа...
<P>...текст третьего параграфа..
</DIV>
Чтобы выровнять по центру весь документ:
<HEAD>
<TITLE>Что за прелесть эта мерзость!</TITLE>
<STYLE type="text/css">
BODY {text-align: center}
</STYLE>
<BODY>
...тело выровнено по центру...
</BODY>
Элемент CENTER полностью эквивалентен определению элемента DIV с атрибутом align, установленным в "center". Элемент CENTER не рекомендуется.