Введение в HTML
.pdf<dd> |
Описывает каждое определение |
|
|
|
|
<ol></ol> |
Создает нумерованный список |
|
|
|
|
<li> |
Определяет каждый элемент списка и при- |
|
сваивает номер |
||
|
||
|
|
|
<ul></ul> |
Создает ненумерованный список |
|
|
|
|
<li> |
Предваряет каждый элемент списка и до- |
|
бавляет кружок или квадратик. |
||
|
||
|
|
|
|
Важный тег, используемый для формати- |
|
<div align=?> |
рования больших блоков текста HTML до- |
|
кумента, также используется в таблицах |
||
|
||
|
стилей |
|
|
|
|
ГРАФИЧЕСКИЕ ЭЛЕМЕНТЫ |
||
|
|
|
<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> |
Создает таблицу. |
|
|
|
|
|
31 |
|
<tr></tr> |
Определяет строку в таблице. |
|
||
|
|
|||
<td></td> |
Определяет отдельную ячейку в таблице. |
|||
|
|
|||
|
Определяет заголовок таблицы (нормаль- |
|||
<th></th> |
ная ячейка с отцентрированным жирным |
|||
|
текстом) |
|
|
|
|
|
|
|
|
АТРИБУТЫ ТАБЛИЦЫ |
|
|
||
|
|
|||
<table border=#> |
Задает толщину рамки таблицы. |
|||
|
|
|||
<table cellspacing=#> |
Задает расстояние между ячейками табли- |
|||
цы. |
|
|
||
|
|
|
||
|
|
|
|
|
<table cellpadding=#> |
Задает расстояние |
между |
содержимым |
|
ячейки и ее рамкой. |
|
|
||
|
|
|
||
|
|
|||
<table width=#> |
Устанавливает ширину таблицы в пикселях |
|||
или процентах от ширины документа. |
||||
|
||||
|
|
|||
|
Устанавливает выравнивание ячеек в таб- |
|||
<tr align=?> или <td align=?> |
лице, принимает значения: left, center, или |
|||
|
right. |
|
|
|
|
|
|||
<tr valign=?> или <td va- |
Устанавливает вертикальное выравнивание |
|||
для ячеек таблицы, |
принимает значения : |
|||
lign=?> |
||||
top, middle, или bottom. |
|
|||
|
|
|||
|
|
|||
|
Указывает количество столбцов, которое |
|||
<td colspan=#> |
объединено в одной ячейке (по умолча- |
|||
|
нию=1). |
|
|
|
|
|
|
||
<td rowspan=#> |
Указывает количество строк, |
которое объ- |
||
единено в одной ячейке (по умолчанию=1). |
||||
|
||||
|
|
|||
<td nowrap> |
Не позволяет программе просмотра делать |
|||
перевод строки в ячейке таблицы. |
||||
|
||||
|
|
|
|
|
|
ФРЕЙМЫ |
|
|
|
|
|
|||
<frameset></frameset> |
Предваряет тег <body> в документе, со- |
|||
держащем фреймы; |
|
|
||
|
|
|
||
|
|
|
|
|
32
<frameset rows="value,value">
<frameset cols="value,value">
<frame>
Определяет строки в таблице фреймов, вы-
сота которых определена количеством пикселей или в процентном соотношении к высоте таблицы фреймов.
Определяет столбцы в таблице фреймов,
ширина которых определена кол-вом пикселей или в процентном соотношении к ширине таблицы фреймов.
Определяет единичный фрейм или область
в таблице фреймов.
<noframes></noframes> |
|
Определяет, что будет показано в окне |
|
браузера, если он не поддерживает фрей- |
|
|
|
|
|
|
мы. |
|
АТРИБУТЫ ФРЕЙМОВ |
|
|
|
|
<frame src="URL">
<frame name="name">
<frame marginwidth=#>
<frame marginheight=#>
<frame scrolling=VALUE>
<frame noresize>
Определяет, какой из HTML документов
будет показан во фрейме.
Указывает Имя фрейма или области, что позволяет перенаправлять информацию в этот фрейм или область из других фреймов.
Определяет величину отступов по левому и правому краям фрейма; должно быть равно или больше 1.
Определяет величину отступов по верхне-
му и нижнему краям фрейма; должно быть равно или больше 1.
Указывает, будет ли выводиться линейка
прокрутки во фрейме; значение value может быть "yes," "no," или "auto". Значение по умолчанию для обычных документов - auto.
Препятствует изменению размеров фрейма.
33
ФОРМЫ
Для форм, выполняющих какие-то функции, должны быть запущены соответствующие CGI скрипты на сервере. HTML только создает внешний интерфейс формы.
<form></form> |
|
Создает формы |
||
<select |
|
multiple |
Создает скролируемое меню. Size устанав- |
|
|
ливает количество пунктов меню, которое |
|||
name="NAME" |
|
|||
|
будет показано на экране, остальные будут |
|||
size=?></select> |
||||
доступны при использовании прокрутки. |
||||
|
|
|
||
<option> |
|
Указывает каждый отдельный элемент ме- |
||
|
ню |
|||
|
|
|
||
<select |
|
|
Создает ниспадающее меню |
|
name="NAME"></select> |
||||
|
||||
<option> |
|
Указывает каждый отдельный элемент ме- |
||
|
ню |
|||
|
|
|
||
<textarea |
name="NAME" |
Создает окно для ввода текста. Columns |
||
указывает ширину окна; rows указывает его |
||||
cols=40 rows=8></textarea> |
||||
высоту. |
||||
|
|
|
||
<input |
type="checkbox" |
Создает checkbox. За тегом следует текст. |
||
name="NAME"> |
||||
|
||||
<input |
|
type="radio" |
Создает radio кнопку. За тегом следует |
|
name="NAME" value="x"> |
текст. |
|||
<input |
type=text name="foo" |
Создает строку для ввода текста. Парамет- |
||
size=20> |
|
ром Size указывается длина в символах. |
||
<input |
type="submit" val- |
Создает кнопку "Принять" |
||
ue="NAME"> |
|
|||
|
|
|||
<input |
type="image" border=0 |
Создает кнопку "Принять" - для этого ис- |
||
name="NAME" |
|
|||
|
пользуется изображение |
|||
src="name.gif"> |
||||
|
||||
|
|
|||
<input type="reset"> |
Создает кнопку "Отмена" |
|||
|
|
|
|
|
34
СОДЕРЖАНИЕ
Введение. Начало создания сайта……………………………………...3 Логическая и физическая структура сайта…………………………….3
Что такое HTML…………………………………………………………4
Основные теги HTML-страницы……………………………………….5
Практическая работа 1…………………………………………………..6 Практическая работа 2…………………………………………………..7 Практическая работа 3…………………………………………………..7 Практическая работа 4…………………………………………………..8 Практическая работа 5…………………………………………………..9 Практическая работа 6…………………………………………………10
Практическая работа 7…………………………………………………13
Практическая работа 8…………………………………………………15
Практическая работа 9 ………………………………………………...17 Практическая работа 10………………………………………………..18 Практическая работа 11………………………………………………..19 Практическая работа 12………………………………………………..20 Практическая работа 13………………………………………………..22 Практическая работа 14………………………………………………..23 Практическая работа 15………………………………………………..25 Практическая работа 16………………………………………………..26 Таблица основных тегов HTML………………………………………28
35
Учебное издание
Хасеневич Ирина Сергеевна
СОЗДАНИЕ WEB-СТРАНИЦ СРЕДСТВАМИ HTMLИCSS
Учебно-методическое пособиедля студентов специальности 1-190101 «Дизайн»
В двух частях Часть 1
Введение в HTML
В авторской редакции
Ответственный за выпуск И.С.Хасеневич
Подписано в печать 04.03.2012. Формат 60×84/16. Бумага офсетная. Усл. печ. л. 2,09.
Уч.- изд. л. 2,11. Тираж 50 экз. Заказ
Белорусский государственный университет. ЛИ № 02330/0494425 от 08.04.2009. Пр. Независимости, 4, 220030, Минск.
Отпечатано на копировально-множительной технике гуманитарного факультета
Белорусского государственного университета Ул. Курчатова, 5, 220064, Минск.