Как создаются странички HTML.
Все что вы видите на экране броузера (будь то Internet Explorer или Netscape
Navigator, или может быть какого другого) Представляет собой HTML документ,
который может являться частью сайта, сервера или просто домашней странички.
HTML - это HyperText Markup Language - Язык разметки гипертекста. Если вы
в своем броузере выберете "Просмотр в виде HTML" - то увидите обыкновенный
текстовый документ! И ваш браузер получая этот документ с сервера показывает
вам красивый текст, таблицы, картинки и возможно проигрывает звуки!
Теперь рассмотрим из чего-же состоит этот документ?
Спец. символы говорящие что и как броузеру показывать называются Тэгами.
Они заключаются в угловые скобки: <тэг>. Очевидно, что необходимо
указать область действия того или иного тэга.
Это делается так: <теэг>область действия
. . . Определяет начало и конец документа.
. . . Определяет начало и конец заголовка документа.
. . . Здесь указывается заглавие текущей страницы.
. . . Определяет начало и конец тела документа.
Атрибуты тега BODY:
BGCOLOR=" . . . " - определяет цвет фона;
BACKGROUND=" . . . " - указывает адрес файла для Background (рекомендуется
подбирать цвет bgcolor, максимально приближенный к
цвету background);
TEXT=" . . . " - задаёт цвет текста;
LINK=" . . . " - задаёт цвет гиперсвязей (ссылок);
VLINK=" . . . " - задаёт цвет ссылок, где пользователь уже побывал;
ALINK=" . . . " - задаёт цвет активной гиперсвязи;
- используется для вставки комментария;
Пример использования:
Параграфы и абзацы:
Начало новой строки, перевод строки.
Начало нового абзаца, перевод строки с отступом.
. . .
Предварительно отформатированный текст (текст располагается
так, как он должен выглядеть на экране).
Определение ширины строки (в пикселах) предварительно
отформатированного текста.
. . . Использование отступов, пробелов.
Атрибуты тега SPACER:
TYPE=horizontal - определение типа пустого блока
TYPE=vertical (горизонтальный, вертикальный, блок);
TYPE=block
SIZE=" . . . " - определение размера пустого блока (в пикселах);
WIDTH=" . . . "
HEIGHT=" . . . " - определение высоты и ширины пустого блока (в пикселах);
ALIGN=left - определение способа выравнивания блока
ALIGN=right (слева, справа, по центру);
ALIGN=center
Примеры использования:
Заголовки:
. . .
Заголовок первого уровня.
. . .
Заголовок второго уровня.
. . .
Заголовок третьего уровня.
. . .
Заголовок четвёртого уровня.
. . .
Заголовок пятого уровня.
. . .
Заголовок шестого уровня.
Разделители:
Горизонтальная линия, идущая через весь экран.
Атрибуты тега HR:
SIZE=" . . . " - определение толщины линии (в пикселах);
WIDTH=" . . . " - определение длины линии (в пикселах или в процентах
от ширины страницы);
COLOR=" . . . " - определение цвета линии;
ALIGN=left - определение способа выравнивания линии
ALIGN=right (слева, справа, по центру);
ALIGN=center
NOSHADE - без использования трёхмерных эффектов;
Примеры использования:
Начертание в правом столбце даёт пример применения описываемого тега.
Установка размера базового шрифта.
Диапазон - от 1 до 7. (По умолчанию принимается 3).
. . . Текст будет отображаться шрифтом большего размера.
. . . Текст будет отображаться шрифтом меньшего размера.
. . . Полужирный текст.
. . . Текст, выделенный курсивом.
. . . Подчёркнутый текст.
. . . Перечёркнутый текст.
. . . Перечёркнутый текст.
. . . Шрифт фиксированной ширины.
Мигающий текст.
. . . Текст смещается вниз.
. . . Текст смещается вверх.
. . . Определение цвета, размера и гарнитуры текста.
Атрибуты тега FONT:
COLOR=" . . . " - определение цвета текста;
FACE=шрифт - определение типа используемого шрифта;
SIZE=" . . . " - определение размера шрифта от 1 до 7 или относительно
базового размера с помощью значений +n или -n;
Примеры использования:
Начертание в правом столбце даёт пример применения описываемого тега.
. . . Отображает информацию об адресе.
. . .
Выделяет текст отступами слева и справа.
Используется для цитирования.
. . . Используется для ссылок (названия книг, фильмов
и т.д.) и цитат.
. . . Для частей исходного текста программ.
. . . Для размещения в документе распечаток программ и т.п.
. . . Выделение текста.
. . . Даёт пример для обсуждаемого термина или понятия.
. . . Для выделения текста, набираемого пользователем на клавиатуре.
. . . Для обозначения переменных, передаваемых с командами.
. . .
Для создания раздела в тексте.
Атрибуты тега DIV:
ALIGN=left - определение способа выравнивания блока (слева, справа,
ALIGN=right по центру);
ALIGN=center
горячая точка Гипертекстовая связь с другой страницей сервера.
горячая точка Гипертекстовая связь в этом же документе
место перехода Определяет место перехода по гиперсвязи в документе.
горячая_точкаГиперсвязь к определённой точке на другой странице
сервера.
Гиперсвязь по изображению с другой страницей
сервера (активное изображение).
горячая точка
Гиперсвязь к файлу изображения, видеофайлу, аудиофайлу и т.п.
Атрибуты тега A HREF:
горячая точка
Атрибут TARGET указывает, что страница, заданная
ссылкой, загрузится в новом окне.
горячая точка
Атрибут TARGET указывает, что страница, заданная
ссылкой, загрузится в новом пустом окне.
горячая точка
Атрибут TARGET указывает, что страница, заданная
ссылкой, загрузится в окне, содержащем ссылку.
горячая точка
Атрибут TARGET указывает, что страница, заданная
ссылкой, загрузится в окне, являющемся
непосредственным владельцем набора фреймов.
горячая точка
Атрибут TARGET указывает, что страница, заданная
ссылкой, загрузится в указанном фрейме.
Элементы списка:
aaa Для того, чтобы задать список, каждый элемент его
bbb помечается (можно в строку).
ссс
Атрибуты тега LI (значения указаны ниже):
TYPE="CIRCLE/DISK/SQUARE" Тип метки для этого и последующих элементов в
неупорядоченном списке.
TYPE="A/a/I/i/1" Тип нумерации для этого и последующих элементов.
VALUE="n" Указывается номер, с которого начинать отсчёт.
Неупорядоченные списки:
Неупорядоченный список.
Атрибуты тега UL:
Атрибут COMPACT указывает, что список будет
представлен в более компактном виде.
Атрибут TYPE="CIRCLE" указывает, что метка будет
в виде кружка.
Атрибут TYPE="DISK" указывает, что метка будет
в виде диска (по умолчанию).
Атрибут TYPE="SQUARE" указывает, что метка будет
в виде квадрата.
Упорядоченные списки:
. . .
Упорядоченный список.
Атрибуты тега OL:
. . .
Атрибут COMPACT указывает, что список будет
представлен в более компактном виде.
. . .
Атрибут TYPE="A" указывает, что метки будут
в виде прописных букв.
. . .
Атрибут TYPE="a" указывает, что метки будут
в виде строчных букв.
. . .
Атрибут TYPE="I" указывает, что метки будут
в виде больших римских цифр.
. . .
Атрибут TYPE="i" указывает, что метки будут
в виде маленьких римских цифр.
. . .
Атрибут TYPE="1" указывает, что метки будут
в виде арабских цифр (по умолчанию).
. . .
Атрибут START="3" определяет, что список будет
пронумерован с указанной цифры .
Меню:
Список в виде меню.
Атрибут COMPACT указывает, что список будет
представлен в более компактном виде.
Списки определений:
. . .
Список определений (словарь терминов).
. . . Этот тег стоит перед Термином.
. . . Этот тег стоит перед Определением указанного выше Термина.
Определяет начало и конец таблицы.
Атрибуты тега TABLE:
BGCOLOR=" . . . " - определяет цвет фона всей таблицы;
BACKGROUND=" . . . " - указывает адрес файла для Background (рекомендуется
подбирать цвет bgcolor, максимально приближенный к цвету
background);
BORDER="n" - задаёт обрамление, образованное линиями шириной n пикселов.
WIDTH=" . . . " - задаёт ширину таблицы (в пикселах или процентах)
ALIGN=left - задаёт способ выравнивания таблицы по ширине страницы
ALIGN=right (слева, справа, по центру)
ALIGN=center
CELLSPACING=" . . . " - задаёт в пикселах расстояние между границами ячейки и её
содержимым;
CELLPADDING=" . . . " - задаёт в пикселах интервал между ячейками;
Пример использования:
< TABLE CELLSPACING=2 CELLPADDING=3 BORDER=1 ALIGN="Center" BGCOLOR="Gray"
BACKGROUND="Bk10.gif" WIDTH=100>
. . .
Определяет начало и конец строки в таблице.
Атрибуты тега TR:
BGCOLOR=" . . . " - определяет цвет фона данной строки;
BACKGROUND=" . . . " - указывает адрес файла для Background данной строки;
BORDER="n" - задаёт обрамление, образованное линиями шириной n пикселов.
ALIGN=left - задаёт способ выравнивания содержимого ячеек в данной
ALIGN=right строке (слева, справа, по центру)
ALIGN=center
VALIGN=top - задаёт способ размещения содержимого ячеек в данной
VALIGN=bottom строке по вертикали (сверху, снизу, по центру, по базовой линии)
VALIGN=center
VALIGN=baseline
Пример использования:
< TR ALIGN="сenter" VALIGN="middle">
. . . | Определяет начало и конец ячейки в таблице.
Атрибуты тега TD:
BGCOLOR=" . . . " - определяет цвет фона данной ячейки;
BACKGROUND=" . . . " - указывает адрес файла для Background данной ячейки;
WIDTH=" . . . " - задаёт ширину ячейки (в пикселах или процентах от ширины
таблицы)
ALIGN=left - задаёт способ выравнивания содержимого ячейки
ALIGN=right (слева, справа, по центру)
ALIGN=center
VALIGN=top - задаёт способ размещения содержимого ячейки по вертикали
VALIGN=bottom (сверху, снизу, по центру, по базовой линии);
VALIGN=center
VALIGN=baseline
ROWSPAN="n" - указывает, что данная ячейка охватывает n соседних строк;
COLSPAN="n" - указывает, что данная ячейка охватывает n соседних столбцов;
NOWRAP - указывает, в данной ячейке отключается режим автоматического
распределения текста по всей ячейке. То есть будет отображаться
лишь та часть текста, которая умещается в ячейке по длине.
Пример использования:
< TD ALIGN="Center" VALIGN="Baseline" COLSPAN="2" WIDTH="30" HEIGHT="30" NOWRAP>
. . . Определяет начало и конец ячейки с заголовком в таблице.
Атрибуты тега TH:
BGCOLOR=" . . . " - определяет цвет фона данной ячейки;
BACKGROUND=" . . . " - указывает адрес файла для Background данной ячейки;
WIDTH=" . . . " - задаёт ширину ячейки (в пикселах или процентах от ширины таблицы)
ALIGN=left - задаёт способ выравнивания содержимого ячейки
ALIGN=right (слева, справа, по центру)
ALIGN=center
VALIGN=top - задаёт способ размещения содержимого ячейки по вертикали
VALIGN=bottom (сверху, снизу, по центру, по базовой линии);
VALIGN=center
VALIGN=baseline
ROWSPAN="n" - указывает, что данная ячейка охватывает n соседних строк;
COLSPAN="n" - указывает, что данная ячейка охватывает n соседних столбцов;
NOWRAP - указывает, в данной ячейке отключается режим автоматического
распределения текста по всей ячейке. То есть будет отображаться
лишь та часть текста, которая умещается в ячейке по длине.
Пример использования:
< TH ALIGN="Center" VALIGN="Baseline" COLSPAN="4" WIDTH="50">
Пример взаимного расположения тегов при описании таблицы:
Определяет начало и конец документа с фреймами. Используется
вместо тега BODY.
Атрибуты тега FRAMESET:
BORDER="n" - задаёт обрамление фреймов, образованное линиями шириной n
пикселов.
BORDERCOLOR=" . . . " - задаёт цвет обрамления;
COLS=" . . . , . . . , . . . "
- задаёт горизонтальное расположение фреймов. В списке
указывается ширина каждого фрейма в пикселах или процентах.
Ширину последнего фрейма можно указать как *, т.е. - всё
остальное пространство.
ROWS=" . . . , . . . , . . . "
- задаёт вертикальное расположение фреймов. В списке
указывается высота каждого фрейма в пикселах или процентах.
Высоту последнего фрейма можно указать как *, т.е. - всё
остальное пространство.
Пример использования:
|