Конспект «WEB- программирование»

Таблица основных тегов HTML

Изменение размера шрифта

Основные теги

< html> < /html>

Указывает программе просмотра страниц, что это HTML документ.

< head> < /head>

Определяет место, где помещается различная информация не отображаемая в теле документа. Здесь располагается тег названия документа и теги для поисковых машин.

< body> < /body>

Определяет видимую часть документа

Теги оглавления

< title> < /title>

Помещает название документа в оглавление программы просмотра страниц

Атрибуты тела документа

< body bgcolor=? >

Устанавливает цвет фона документа, используя значение цвета в стандарте RGB - пример: FFFF00 - желтый цвет.

< body text=? >

Устанавливает цвет текста документа, используя значение цвета в стандарте RGB - пример: 00ff00 - зеленый цвет.

< body link=? >

Устанавливает цвет гиперссылок, используя значение цвета в стандарте RGB - пример: 00FF00 - зеленый цвет.

< body vlink=? >

Устанавливает цвет гиперссылок, на которыхх вы уже побывали, используя значение цвета в виде стандарте RGB - пример: 333333 - темно-серый цвет.

< body alink=? >

Устанавливает цвет гиперссылок при нажатии.

Теги форматирования текста

< pre> < /pre>

< h1> < /h1>

Создает

САМЫЙ БОЛЬШОЙ

заголовок (как отдельный абзац)

< h6> < /h6>

Создает

САМЫЙ МАЛЕНЬКИЙ

заголовок

< b> < /b>

Создает жирный текст

< i> < /i>

Создает наклонный текст

< tt> < /tt>

Создает текст - имитирующий стиль печатной машинки.

< cite> < /cite>

Используется для цитат, обычно наклонный текст.

< em> < /em>

Используется для выделения из текста слова (наклонный или жирный текст)

< font size=? > < /font>

Устанавливает размер текста в пределах от 1 до 7.

< font color=? > < /font>

Устанавливает цвет текста, используя значение цвета в виде RRGGBB.

Гиперссылки

< a href=" URL" > ТЕКСТ< /a>

Создает гиперссылку на другие документы или часть текущего документа. Здесь URL адрес ссылки, ТЕКСТ - текст ссылки.

< a href=" URL" >

< img src=" imgURL" > < /a>

Создает гиперссылку на рисунок, находящийся по адресу imgURL.

" URL" = " links/main. htm"

Адрес документа main. htm, находящегося в локальной папке links данного компьютера.

" URL" =

" http: //www. rambler. ru"

Ссылка на ресурс, находящийся на удаленном компьютере. В адресе присутствуют: программа связи с удаленным компьютером http (HyperTextTransfer Protocol, разделители : // и интернет (IP) адрес искомого ресурса (в данном случае поискового сервера Rambler).

< a href=" mailto: EMAIL" >

< /a>

Создает гиперссылку вызова почтовой программы для написания письма по указанному адресу.

< a name=" NAME" > < /a>

Отмечает часть текста как место перехода по гипперссылке в документе.

< a href=" #NAME" > < /a>

Создает гиперссылку на помечанную часть текущего документа.

Форматирование

< p>

Создает новый параграф

< p align=? >

Выравнивает параграф относительно одной из сторон документа, значения: left, right, justify или center

< br>

Вставляет перевод

строки.

< blockquote>

< /blockquote>

Создает отступы с обеих сторон текста.

< dl> < /dl>

Создает список определений.

Штанга < dt>

Основной снаряд в тяжелой атлетике. Состоит из стального грифа (стержня) со втулками на концах и свободно надевающихся металлических дисков. < dd>

< dt>

Определяет каждый из терминов списка

< dd>

Описывает каждое определение

< ol> < /ol>

Создает нумерованный список

< li>

Определяет каждый элемент списка и присваивает номер

< ul> < /ul>

Создает ненумерованный список

< li>

Предваряет каждый элемент списка и добавляет кружок или квадратик.

< div align=? >

Тег, используемый для форматирования больших блоков текста HTML документа. Часто используется в таблицах стилей

Использование кодов символов и специальных знаков в документе HTML

Код в документе HTML

Выводится браузером на экран

& #32;

& #33;

& #34;

& #35;

& #36;

& #37;

& #38;

& #60;

& #61;

& #62;

& #169;

& #171;

& #177;

& #185;

& #187;

& #197;

& nbsp;

& lt;

& gt;

& quot;

пробел

!

"

#

$

%

&

<

=

>

©

«

±

¹

»

Å

Неразрывный пробел

<

>

"

Графические элементы

< img src=" name" >

Добавляет изображение в HTML документ

< img src=" name" align=? >

Выравнивает изображение к одной из сторон документа, принимает значения: left, right, center; bottom, top, middle

< img src=" name" border=? >

Устанавливает толщину рамки вокруг изображения

< hr>

Добавляет в HTML документ горизонтальную линию.

< hr size=? >

Устанавливает высоту(толщину) линии

< hr width=? >

Устанавливает ширину линии, можно указать ширину в пикселях или процентах.

< hr noshade>

Создает линию без тени.

< hr color=? >

Задает линии определенный цвет. Значение RRGGBB.

Таблицы

< table> < /table>

Создает таблицу.

< tr> < /tr>

Определяет строку в таблице.

< td> < /td>

Определяет отдельную ячейку в таблице.

< th> < /th>

Определяет заголовок таблицы (нормальная ячейка с отцентрованным жирным текстом)

Атрибуты таблицы

< table border=#>

Задает толщину рамки таблицы. (здесь 5)

< table cellspacing=#>

Задает расстояние между ячейками таблицы.

< table cellpadding=#>

Задает расстояние между содержимым ячейки и ее рамкой.

< table width=#>

Устанавливает ширину таблицы в пикселах или процентах от ширины документа.

< tr align=? > или < td align=? >

Устанавливает выравнивание ячеек в таблице, принимает значения: left, center, или right. (здесь right )

< tr или < td

Устанавливает вертикальное выравнивание для ячеек таблицы, принимает значения: top, middle, или bottom.

< td colspan=#>

Указывает кол-во столбцев которое объединено в одной ячейке. (по умолчанию=1)

< td rowspan=#>

Указывает кол-во строк которое объединено в одной ячейке. (по умолчанию=1)

< td nowrap>

Не позволяет программе просмотра делать перевод строки в ячейке таблицы.

Фреймы

< frameset> < /frameset>

Предваряет тег < body> в документе, содержащем фреймы;

< frameset rows=" value, value" >

Определяет строки в таблице фреймов, высота которых определена кол-вом пикселов или в процентном соотношении к высоте таблицы фреймов.

< frameset cols=" value, value" >

Определяет столбцы в таблице фреймов, ширина которых определена кол-вом пикселов или в процентном соотношении к ширине таблицы фреймов.

< frame>

Определяет единичный фрейм или область в таблице фреймов.

< noframes> < /noframes>

Определяет, что будет показано в окне браузера если он не поддерживает фреймы.

Атрибуты фреймов

< frame src=" URL" >

Определяет какой из HTML документов будет показан во фрейме.

< frame name=" name" >

Указывает Имя фрейма или области, что позволяет перенаправлять информацию в этот фрейм, или область из других фреймов.

< frame marginwidth=#>

Определяет величину отступов по левому и правому краям фрема; должно быть равно или больше 1.

< frame marginheight=#>

Определяет величину отступов по верхнему и нижнему краям фрейма; должно быть равно или больше 1.

< frame scrolling=VALUE>

Указывает будет ли выводится линейка прокрутки во фрейме; значение value может быть " yes, " " no, " или " auto". Значение по умолчанию для обычных документов - auto.

< frame noresize>

Препятствует изменению размеров фрейма.

Формы¹

¹ Для форм, выполняющих какие-то функции должны быть запущены соответствующие CGI скрипты на сервере. HTML создает только внешний интерфейс формы.

< form> < /form>

Создает формы

< select multiple name=" NAME" size=? > < /select>

Создает скролируемое меню. Size устанавливает кол-во пунктов меню, которое будет показано на экране, остальные будут доступны при использовании прокрутки.

< option>

Указывает каждый отдельный элемент меню

< select name=" NAME" > < /select>

Создает ниспадающее меню

< option>

Указывает каждый отдельный элемент меню

< textarea name=" NAME" cols=40 rows=8> < /textarea>

Создает окно для ввода текста. Columns указывает ширину окна; rows указывает его высоту.

< input type=" checkbox" name=" NAME" >

Создает checkbox. За тегом следует текст.

< input type=" radio" name=" NAME" value=" x" >

Создает radio кнопку. За тегом следует текст.

< input type=text name=" foo" size=20>

Создает строку для ввода текста. Параметром Size указывается длина в символах.

< input type=" submit" value=" NAME" >

Создает кнопку " Принять"

< input type=" image" border=0 name=" NAME" src=" name.gif" >

Создает кнопку " Принять" - для этого используется изображение

< input type=" reset" >

Создает кнопку " Отмена"