- •© КНТЭУ, каф.ЭКИС, доц. Шклярский С.М.
- •1. Определение, назначение, эволюция HTML
- •2. Конструкции и синтаксис языка
- •Два типа тегов:
- •Атрибуты – это директивы, которые обеспечивают дополнительную информацию для элементов HTML
- •Комментарии – это специальные элементы, содержимое которых игнорируется процедурой рендеринга браузера.
- •3. Структура HTML-документа.
- •4. Элементы заголовка.
- •TITLE - определяет имя всего документа, которое отображается в заголовке окна браузера.
- •STYLE - позволяет разместить информацию стиля в "шапке"
- •SCRIPT - помещает скрипт-код в документ
- •META содержит метаданные и управляющую информацию, которую браузер использует для
- •!DOCTYPE – информирует браузер о стандарте, который нужно применять для парсинга веб-документа.
- •5. Элементы и атрибуты тела документа
- •Определение структуры
- •3 способа задания RGB-палитры:
- •Элемент заголовка
- •Внешний вид текста
- •Разделители
- •Графика
- •6. Таблицы
- •Атрибуты:
- •7. Фреймы
- •Структура фреймов формируется при помощи специальноro элемента FRAМESET.
- •ВОПРОСЫ?
SCRIPT - помещает скрипт-код в документ
Допускается любое количество в разделе HEAD документа.
Синтаксис:
<SCRIPT [type=“text/{javacsript}|{vbscript}”] [scr=“URL скрипта”]>
</SCRIPT>
Например:
<SCRIPT type=“text/javacsript”> [тело скрипта]
</SCRIPT>
Язык гипертекстовой разметки HTML |
© КНТЭУ - 2010, каф. ЭКИС, доц. Шклярский С.М. |
META содержит метаданные и управляющую информацию, которую браузер использует для
правильного отображения и обработки содержания тела документа.
Метаданные - информация о самом документе, а не о его содержимом.
Каждый элемент META определяет пару свойство-значение. Атрибут name идентифицирует свойство, а атрибут content определяет значение свойства
Основные атрибуты: author , copyright , keywords, date, description
<META name="author" content=“Пупкин">
<META name="copyright" content="© 2011 EKIS."> <META name="keywords“ content=“лаб №1,пример,">
Язык гипертекстовой разметки HTML |
© КНТЭУ - 2010, каф. ЭКИС, доц. Шклярский С.М. |
!DOCTYPE – информирует браузер о стандарте, который нужно применять для парсинга веб-документа.
всегда должен быть первым на веб-странице
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" http://www.w3.org/TR/html4/frameset.dtd">
Язык гипертекстовой разметки HTML |
© КНТЭУ - 2010, каф. ЭКИС, доц. Шклярский С.М. |
5. Элементы и атрибуты тела документа
Классификация элементов:
Определение структуры
Внешний вид текста
Ссылки и графика
Разделители
Списки
Таблицы
Формы
Язык гипертекстовой разметки HTML |
© КНТЭУ - 2010, каф. ЭКИС, доц. Шклярский С.М. |
Определение структуры
<BODY></BODY> Указывает начало и конец тела (содержательной части) HTML-документа.
background = URL - рисунка для фона.
bgcolor = цвет – цвет фона
text = цвет - устанавливает цвет текста страницы
link = цвет - цвет непосещённых гиперссылок
vlink = цвет - цвет посещённых гиперссылок
alink = цвет - цвет гиперссылок при выборе
пользователем
Цвета определяются с помощью RGB-кода, где каждый цвет представлен в виде комбинации красного (R - red), зеленого (G - green) и синего (B - blue) цветов в определённых пропорциях.
Язык гипертекстовой разметки HTML |
© КНТЭУ - 2010, каф. ЭКИС, доц. Шклярский С.М. |
3 способа задания RGB-палитры:
1.По названию (red, black …)
2.В виде сочетания трех двуразрядных шестнадцатеричных
чисел.
Первые две цифры соответствуют красному цвету, вторые - зелёному, третьи - синему
color=#000000-черный, #FFFFFF-белый
3.В виде списка в формате (ч,ч,ч), где ч – десятичная запись оттенка соответственно: красного, зеленого, синего 0<=ч<=255, например: (0,125,255)
Белый цвет в 3-х формах:
White = #FFFFFF = (255,255,255)
Язык гипертекстовой разметки HTML |
© КНТЭУ - 2010, каф. ЭКИС, доц. Шклярский С.М. |
Элемент заголовка
<Hn></Hn>, где 1<= n <=6 – уровни заголовка
<DIV></DIV>
Элемент секции – позволяет задать свойства именованной части веб-документа
Атрибуты:
id, class (идентификаторы документа)
align (выравнивание): LEFT|RIGHT|CENTER
Язык гипертекстовой разметки HTML |
© КНТЭУ - 2010, каф. ЭКИС, доц. Шклярский С.М. |
<BLOCKQUOTE></BLOCKQUOTE> - цитата
<EM></EM> - выделенеие
<STRONG></STRONG> - дополнительное выделение
<CITE></CITE> - цитата, сноска
<CODE></CODE> - код
<SAMP></SAMP> - пример вывода
<KBD></KBD> - ввод с клавиатуры
<VAR></VAR> - переменная
<DFN></DFN> - определение
<ADDRESS></ADDRESS> - адрес
<BIG></BIG> - большой шрифт
<SMALL></SMALL> - малый шрифт
Язык гипертекстовой разметки HTML |
© КНТЭУ - 2010, каф. ЭКИС, доц. Шклярский С.М. |
Внешний вид текста
<b></b> - полужирное начертание. <i></i> - курсивное начертание.
<u></u> - подчеркнутое начертание. <tt></tt> - телетайпный шрифт. <s></s> - перечеркнутый текст <sup></sup> - верхний индекс <sub></sub> - нижний индекс
<font></font> с атрибутом size.
В качестве значений этого атрибута используются целые числа от 1 до 7. 1 соответствует
минимальному размеру шрифта, 7 – |
максимальному. |
|
В тэгах <font></font> может использоваться |
||
также атрибут color для указания цвета |
шрифта. |
Язык гипертекстовой разметки HTML |
© КНТЭУ - 2010, каф. ЭКИС, доц. Шклярский С.М. |
Разделители
<P [ALIGN=LEFT|CENTER|RIGHT]>текст </P> - параграф
<BR/> - новая строка
<HR [ALIGN=LEFT|RIGHT|CENTER]
[SIZE=n] [WIDTH=n[%]] [NOSHADE]/> - горизонтальный разделитель
Списки
<UL><LI>текст [<LI>текст]…</UL> - неупорядоченый список <OL><LI>текст [<LI>текст]…</OL> - нумерованый список
Язык гипертекстовой разметки HTML |
© КНТЭУ - 2010, каф. ЭКИС, доц. Шклярский С.М. |