HTML/ основные понятия

Язык HTML

Пупко Андрей Владимирович

начальник отдела « Интернет технологий“ ЦИТ БГУ

История

• Развитие WWW технологий (1990 г.)
• HTML 2.0 (1994 г. )
• HTML 3.0 (1995 г. )
• HTML 3. 2 (199 6 г. )
• HTML 4.0  Dinamic HTML (1997 г. )
• XML (1998 г.)

Иерархия языков разметки

Standard Generalized Markup Language SGML (1986 г.)

Extensible Markup Language XML

Dynamic HTML

Hypertext Markup Language HTML

WRML

Характеристика HTML

• Публикация электронных данных с заголовком, текстами и т.д.
• Использование гиперссылок для навигации
• Использование форм для интеграции с удаленными службами (БД, каталоги и т.д.)
• Включение эл. таблиц, видеоклипов и т.д. в структуру документа
• Встроенный язык управления сценариями

Свойства HTML

• Регистро независимость
• Легкость в использовании
• Интерпретируемость
• Отсутствие строгости
• Разное понимание различными браузерами

текст текст " width="640"

Общая структура

• Теги +Текст
• Тег --
• Линейное использование

• текст текст2
• текст текст2

• Последовательное использование

• текст
• текст

• Иерархическое использование запрещено

• текст
• текст

Классификация тегов

• По функциональности
• По типу действия

• открывающие
• открывающие

• закрывающие
• закрывающие

• По парности

• Непарные
• Непарные

,

• ,
  
• ,
  

• Парные обязательные
• Парные обязательные

…

• …
• …

• Парные необязательные
• Парные необязательные

Классификация тегов (функциональность)

• Общие для документа
• Текст
• Таблицы
• Графика
• Ссылки
• Фреймы
• Внедренные объекты
• JavaScript

Структура HTML документа

Моя страница

… .

… .

• … . … .

Цвета

• Цифровое указание
• #RRGGBB

0- FF

0- FF

0- FF

Цвета

• Именное указание

Тег BODY

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

• Параграф

• Новая строка

• Отформатированный текст

…….

• …….

• Заголовки ….

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

• Фонт

…..

• …..

• Оформление

жирный

курсив

подчеркивание

• жирный курсив подчеркивание

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

• Перечисление

• …..

• …..
  • …..
  • …..
  • …..
  • …..

• Нумерация

1. …..

2. …..
   • …..
   • …..
   • …..
   • …..

" width="640"

Тег графики

src=путь к изображению

border=толщина границы

hspace= горизонтальный отступ

vspace= вертикальный отступ

width=ширина

height=высота

align=выравнивание

Alt= подпись

• src=путь к изображению border=толщина границы hspace= горизонтальный отступ vspace= вертикальный отступ width=ширина height=высота align=выравнивание Alt= подпись

Тег ссылок

• текст или графика

Относительные и фиксированные ссылки

• Фиксированные ссылки

• href=/doclad/page1.htm для фиксированных данных типа оформления
• href=/doclad/page1.htm
• для фиксированных данных типа оформления

• Относительные ссылки

• href=page1.htm для текущих данных
• href=page1.htm
• для текущих данных

Теги форматирования таблиц

Теги форматирования таблиц

Теги форматирования таблиц (строки)

Теги форматирования таблиц (ячейки)

Фреймы

Встроенные кадры

Фреймы

• Плюсы :

• единое оформление малый размер
• единое оформление
• малый размер

• Минусы

• открытие в новом окне без фрейма невозможность выделения пункта невозможность создания закладки
• открытие в новом окне без фрейма
• невозможность выделения пункта
• невозможность создания закладки

Тег формы