HTML (от англ. HyperText Markup Language — «язык разметки гипертекста») — стандартный язык разметки веб-страниц. Команды языка HTML называются тегами. Атрибут указывает тегу характеристики элемента. Совокупность команд, атрибутов и их значений всего документа принято называть HTML-кодом. HTML-код является основой при создании Web-страниц и применяется для размещения различных элементов страницы (теста, графики, таблиц и т.д). HTML-код преобразовывается браузером и отображается на экране уже в привычном нам виде.
Как Вы видите, любой HTML-документ начинается с тега <html> и кончается тегом </html> (последний тег является закрывающим и его признак - символ /). Любой HTML-документ состоит из двух частей. Первая часть - заголовок, который находится между тегами <head> и </head>, или же "голова" странички. Название странички располагается между тегами <title> и </title> и появляется в заголовке окна браузера.Вторая часть HTML-документа - тело, которое выводится на экран браузером, - содержит текст, картинки, видеофрагменты. Она заключается между тегами <body> и </body>. Теги бывают парные и непарные, открывающие и закрывающие. Область действия парного тега начинается с того места, где стоит открывающийтег (например <body>), а кончается там, где встречается закрывающий(</body>).В примере выше, у открывающего тега <body> есть атрибут bgcolor= "yellow",он должен находиться после одного или нескольких пробелов от < body, таковы законы HTML. Так вот этот атрибут задает цвет фона Вашей странички, в данном случае это yellow - желтый (он может иметь различные значения, например red - красный или black - черный, но встречаются и такие как #2A2A2A - цвета с оттенками. Такие цвета специальными программами-редакторами веб-страниц, проставляются автоматически, вам нужно только выбрать нужный цвет в спец. образцах цветов). Вы наверное заметили, что yellow находится в кавычках, эти кавычки необязательный параметр(т. е. можно записать и так: <body bgcolor=yellow>).Так же в примере выше Вы найдете строку <center>Моя страничка </center>, здесь тег <center> центрирует текст (размещает его посередине). Тег <center> , можно назвать универсальным т.к. он центрирует практически все (гиперссылки, фотографии, картинки, текст и т. д., но об этом позже). Есть и комментарий - не воспринимается браузером как команда, в нем можно писать все что угодно.
Элемент
Назначение
<html> ... </html>
Начальный и заключительный тег HTML-документа
<head> ... </head>
Объявление заголовка WEB-страницы, содержит описание страницы
<title> ... </title>
Элемент определяет название страницы, которое выводится в строке заголовка окна браузера. Располагается внутри заголовка <html> WEB-страницы, учитывается при индексации страницы поисковыми машинами
<body> ... </body>
Между этими тегами находится основное содержание страницы
Атрибут
Назначение
bgcolor="значение"
Задает фоновый цвет страницы. Переменная "значение" представлена в виде текстовой величины (принятые в WEB названия цветов), либо в виде шестнадцатиричного числа, обозначающего цвет - "#ddf112"
background="адрес"
Задает фоновый рисунок страницы. "значение" - адрес файла изображения, которое станет фоновым рисунком страницы. При этом рисунок не растягивается, а заполняет всю страницу путем клонирования
<base href="адрес">
Определение "базового" URL каталога сайта. Все относительные ссылки на странице, содержащей этот элемент будут определяться относительно него. Располагается внутри элемента <head>
Элемент
Назначение
<em> ... </em>
Выделение
<strong> ... </strong>
Усиленное выделение
<cite> ... </cite>
Цитата или ссылка на внешний источник
<dfn> ... </dfn>
Исходный код программы
<samp> ... </samp>
Пример работы программы, часто отображается так же, как и предыдущий
<kbd> ... </kbd>
Текст, вводимый с клавиатуры
<var> ... </var>
Переменная или значение
<q> ... </q>
Цитируемый текст
<abbr> ... </abbr>
Аббревиатура
<acronym> ... </acronym>
Акроним
<img>
Вставка изображения на страницу
Атрибут
Назначение
src="адрес"
указывает URL-адрес, по которому находится файл изображения. Может быть как относительным, так и абсолютным
alt="значение"
Содержит текст, который выводится на экран браузера при невозможности вывести изображение
align="значение"
Определяет поряддок вывода текста относительно боковых сторон изображения:
"top" - текст располагается рядом с верхней границей изображения;
"middle" - текст располагается рядом с серединой изображения;
"bottom" - текст располагается рядом с нижней границей изображения (по умолчанию)
Еще два параметра, делающие изображения "плавающими", при этом текст обтекает изображение:
"right" - помещает изображение к правой границе WEB-страницы;
"left" - помещает изображение к левой границе WEB-страницы
width="значение"
Ширина рисунка (резервируется место под изображение, создавая рамку)
height="значение"
Высота рисунка (резервируется место под изображение, создавая рамку)
<a> ... </a>
Вставка гиперссылки на страницу. Между начальным и закрывающим тегами должен находиться текст или картинка, которые отображают гиперссылку на экране браузера
Атрибут
Назначение
href="адрес"
указывает URL-адрес, по которому находится документ, который должна открывать ссылка. Может быть как относительным, так и абсолютным
title="значение"
Содержит поясняющий текст, который выводится на экран браузера при наведении курсора мыши на гиперссылку
name="значение"
Устанавливает закладку на странице, используемую для переходов внутри страницы
target="_blank"
Позволяет автоматически открывать гиперссылку в новом окне
Пример: <a href="Адрес" title="Заголовок" target="_blank">Текст ссылки или картнка</a>
Таблица 3.2. Добавление таблиц на страницу:
Элемент
Назначение
<table> ... </table>
Вставка таблицы на страницу
Атрибут
Назначение
bgcolor="значение"
Фоновый цвет таблицы. Значение - WEB-название цвета или его шестнадцатиричный код
* - может применяться с элементами <td> и <tr>
width="значение"
ширина таблицы. Задается либо в пикселях (абсолютный размер), либо в процентах от ширины страницы (относительный размер)
* - может применяться с элементом <td>
align="значение"
Определяет порядок вывода таблицы относительно границ WEB-страницы:
"left" - таблица располагается слева у границы страницы, обтекается текстом;
"right" - таблица располагается справа у границы страницы, обтекается текстом;
"center" - таблица расположена по центру страницы.
cellpadding="значение"
определяет расстояние между границами ячеек и их содержимым (в пикселах)
cellspacing="значение"
задает расстояние в пикселах между ячейками таблицы
border="значение"
задает ширину внутренних и внешних границ таблицы в пикселах
<tr> ... </tr>
Определяет строку таблицы
Атрибут
Назначение
align="значение"
Определяет порядок вывода данных в ячейках:
"left" - с выравниванием по левому краю ячеек;
"right" - с выравниванием по правому краю ячеек;
"center" - с выравниванием по центру ячеек
* может использоваться с элементом <td>
valign="значение"
Определяет порядок вывода данных в ячейках:
"top" - вверху ячеек;
"bottom" - внизу ячеек
"center" - по центру ячеек * может использоваться с элементом <td>
* См. атрибуты элемента <table>
<td> ... </td>
Определяет ячейки таблицы
Атрибут
Назначение
colspan="значение"
задает количество ячеек для объединения в строке таблицы
rowspan="значение"
задает количество ячеек для объединения в столбце таблицы