- •Языки разметки документов Язык разметки
- •Задание функций обработки выделенных элементов
- •Выделение логических элементов документа
- •Описательная разметка
- •Теговая структура языка разметки
- •Инструментарий
- •Структура документа
- •Тег meta . Атрибут http-equiv
- •Тег meta . Атрибут name
- •Текст и шрифтовое оформление Логическая и физическая разметка
- •Элементы физической разметки
- •Элементы логической разметки
- •Другие элементы
- •Спецсимволы html
- •Список определений
- •Вложенные списки
- •Гиперссылки
- •Гиперссылки. Тег а
- •Гиперссылки. Url
- •Адрес ссылки может быть абсолютным, относительным и неполным.
- •Активные изображения
- •Серверные карты
- •Создание таблицы
- •Пример таблицы
- •Области применения таблиц в html
- •Фреймы в html
- •Элементы фреймовой структуры
- •Особенности фреймовой структуры
- •Фреймовая структура
- •Вложение фреймовая структура
- •История css
- •Включение css в html
- •Включение css в html. Внедрение
- •Включение css в html. Встраивание
- •Включение css в html. Импортирование
- •Включение css в html. Связывание
- •Синтаксис css
- •Синтаксис css. Селекторы
- •Синтаксис css. Псевдоклассы
- •Синтаксис css. Наследование
- •Язык xml Общие сведения о xml
- •Синтаксис xml
- •Конструкции языка xml Элементы данных
Фреймовая структура
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>Фреймы</title>
<meta http-equiv="Content-Type" content="text/html; charset=Windows-1251">
</head>
<frameset rows="1*,1*,2*" cols="1*,1*,1*" >
<frame src = "frame01.html"> <frame src = "frame02.html"> <frame src = "frame03.html">
<frame src = "frame04.html“> <frame src = "frame05.html“> <frame src = "frame06.html">
<frame src = "frame07.html“> <frame src = "frame08.html“> <frame src = "frame09.html">
</frameset>
</html>
Фреймы в GOOGLE
|
Фреймы в IE |
Фреймы в FIREFOX
|
Фреймы в OPERA |
Вложение фреймовая структура
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>Фреймы</title>
<meta http-equiv="Content-Type"
<frameset cols="1*,2*,1*" >
<frameset rows="1*,1*,3*" >
<frame src = "frame01.html" scrolling="no"> <frame src = "frame02.html"> <frame src = "frame03.html">
</frameset>
<frame src = "frame04.html">
<frameset rows="1*,1*,3*" >
<frame src = "frame05.html"> <frame src = "frame06.html"> <frame src = "frame07.html">
</frameset></frameset>
</html>
Тег <NOFRAMES>
Содержимое тега <NOFRAMES> отображается в браузере, когда он не поддерживает фреймы и не умеет их интерпретировать. Браузеры, которые работают с фреймами, полностью игнорируют содержимое тега <NOFRAMES>.
Атрибутов нет. Является контейнером. Закрывающий тег обязателен.
Внутри этого тега располагается текст, информирующий пользователя о том, что его браузер фреймы не поддерживает или с предложением перейти на страницу без фреймов.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Тег NOFRAMES</title>
</head>
<frameset cols="100,*,20%">
<frame src="left.html" name="leftFrame"> <frame src="main.html" name="mainFrame"> <frame src="right.html" name="rightFrame">
<noframes>Ваш браузер не поддерживает фреймы.</noframes>
</frameset>
</html>
Тег <IFRAME>
Тег <IFRAME> создает плавающий фрейм, который находится внутри обычного документа, он позволяет загружать в область заданных размеров любые другие независимые документы.
Является контейнером. Закрывающий тег обязателен.
Содержание тега игнорируется браузерами, не поддерживающих данный тег. Для таких браузеров можно указать альтернативный текст, который увидят пользователи. Он должен располагаться между элементами <IFRAME> и </IFRAME>.
Атрибуты:
src - Путь к файлу, содержимое которого будет загружаться во фрейм. src = URL
name - Имя фрейма. name="имя"
scrolling - Способ отображения полосы прокрутки во фрейме.
scrolling= auto | no | yes
frameborder - Устанавливает, отображать границу вокруг фрейма или нет. frameborder= yes | no | 1 | 0
align - Определяет как фрейм будет выравниваться по краю, а также способ обтекания его текстом. align=bottom|top|middle|left|right|texttop|absmiddle|baseline
height - Высота фрейма. height = n | %
width - Ширина фрейма. width = n | %
hspace - Горизонтальный отступ от фрейма до окружающего контента. hspace = n
vspace - Вертикальный отступ от фрейма до окружающего контента.
vspace = n
Таблицы стилей CSS. Основы dynamic HTML
Cascading Style Sheets (CSS) - каскадные таблицы стилей.
Цель CSS - отделить дизайн web-страницы от ее структуры и содержания.
В классическом HTML структура и дизайн были вперемешку: рядом с текстовым абзацем его цвет, размер шрифта, тип шрифта и т.п. При попытке изменить такой простой параметр, как размер шрифта на своем сайте - придется переписывать все странички.
CSS позволяет назначить всем объектам стиль, описание которого может храниться как в самом HTML-документе, так и в отдельном файле. Используя CSS, можно изменить размер шрифта во всех страницах сайта, исправив только один файл с описанием стилей.
Основным понятием CSS является стиль – набор правил оформления и форматирования, который может быть применен к различным элементам страницы.
Другое важное понятие каскад. Стандарт CSS определяет приоритеты, в порядке которых применяются правила стилей, если для какого-то элемента подходят свойства нескольких правил одновременно (или, в редких случаях, в одном правиле есть одноименные свойства). Это называется «каскадом», в котором для свойств рассчитываются приоритеты или «веса», что делает результаты предсказуемыми. Более частные определения имеют больший приоритет.