Программа для просмотра web-страниц, которая преобразует тэги html-документа в соответствующее им представление страницы на экране монитора.
| Вид материала | Программа |
СодержаниеПонятие о командах (тэгах) языка HTML Структура HTML-документа Работа с графическими изображениями |
- Тема урока: Создание Web страниц с помощью html, 39.83kb.
- Концепция www 4 Создание Web-страницы с помощью языка html 6 1 Язык html 6 Структура, 213.14kb.
- Концепция www 4 Создание Web-страницы с помощью языка html 6 1 Язык html 6 Структура, 214.3kb.
- Концепция www 5 Создание Web-страницы с помощью языка html 7 1 Язык html 7 Структура, 217.81kb.
- Моу сош №18 г. Новотроицк, моу сош, 95.86kb.
- Текст документа, 245.21kb.
- Html, " onclick="return false">, 258.05kb.
- Создание собственной web-страницы в Internet, 927.61kb.
- Сценарий занятия «html-проектирование: Достопримечательности Мурманской области», 72.96kb.
- План лабораторных работ Введение в Web-программирование; создание html-страниц, работа, 6.6kb.
Html-документ. Web-страницы создаются на основе языка HTML (HyperText Markup Language – язык разметки гипертекста). Основа любой web-страницы – это html-документ – текстовый файл (расширение .htm /.php/), содержащий тэги - команды языка HTML, при помощи которых подключаются дополнительные ресурсы web-страницы (например, графика), задается ее структура и форматирование, ссылки на другие страницы сети и т.д.
Браузер - программа для просмотра web-страниц, которая преобразует тэги html-документа в соответствующее им представление страницы на экране монитора. Наиболее популярные браузеры - Microsoft Internet Explorer, Mozilla Firefox.
Кроме языка HTML при создании web-страниц используются и многие другие: CSS, " onclick="return false">
Понятие о командах (тэгах) языка HTML
Структуру html-документа задают команды (тэги, дескрипторы) языка HTML, основные принципы использования которых представлены ниже:
- Тэг задается в виде группы символов, заключенных между знаками < и > .
- Тэги бывают парные и непарные. Парный тэг, в отличие от непарного, требует указания места окончания своего действия. Примеры:
- непарный тэг, … - парный тэг (не забывайте указывать место окончания действия для парного тэга!).
- Тэг может дополняться атрибутами, которые уточняют его действие. Атрибуты задаются внутри границ тэга < > и отделяются пробелом. Атрибутам всегда присваивается некоторое значение через символ =
- Прописные и строчные буквы при написании тэгов не различаются (лучше пользоваться строчными). Записанные в исходном html-документе переводы строк и подряд идущие пробелы, а также неправильно оформленные тэги браузером игнорируются.
Структура HTML-документа
информационное наполнение web-страницы
- тэг, ограничивающий тело (основу) html-документа.
При помощи атрибутов может задавать следующие параметры документа:
1. Фоновый рисунок
- BACKGROUND – файл фона, с указанием пути к этому файлу.
Например "pictures/fon.jpg".
- BGCOLOR - цвет фона, который задается при помощи цифрового кода (="#ff0000") или словом (="red"). По умолчанию – белый.
2. Цвет основного текста и ссылок: TEXT – цвет основного текста в документе (по умолчанию – черный), LINK - цвет гиперссылки (по умолчанию – темно-синий), ALINK - цвет активной гиперссылки (в момент щелчка по ней мышью), VLINK - цвет посещенной гиперссылки (по умолчанию - фиолетовый).
3. Отступы документа (в пикселях): TOPMARGIN (верхний отступ), BOTTOMMARGIN (нижний отступ), LEFTMARGIN (левый отступ).
Форматирование шрифта
- задание характеристик шрифта при помощи следующих атрибутов:
- FACE - гарнитура шрифта, например Times New Roman, Arial, …
- SIZE - размер шрифта: от 1 до 7, по умолчанию - 3.
- COLOR - цвет шрифта: цифровой код в формате #RRGGBB или английское слово, например red, green, yellow, … По умолчанию - черный (#000000 или black).
Изменения начертания шрифта может производиться при помощи тэгов:
- полужирный.
- курсив.
- подчеркнутый.
- нижний индекс.
- верхний индекс.
Форматирование абзацев
- абзац основного текста, который отделяется от предыдущего абзаца отступом.
Атрибут ALIGN - горизонтальное выравнивание текста абзаца: = left (по левому краю - по умолчанию) - center (по центру) - right (по правому краю) - justify (по ширине).
…
- абзац-заголовок: полужирное начертание и более крупный, чем в основном абзаце, шрифт.
- заголовок 1-го уровня (наиболее крупный) - далее в сторону уменьшения. Возможно использование атрибута ALIGN.
- маркированный список, каждый элемент которого должен начинаться с тэга
Атрибут TYPE - тип маркера: disk ( - по умолчанию) - circle (º) - square (□).
Атрибут TYPE - тип нумерации: 1 (нумерация обычными числами - по умолчанию), i или I (строчными или заглавными римскими цифрами), а или А (строчными или заглавными латинскими буквами).
- перевод строки внутри абзаца (без межабзацного отступа).
- задание текстового блока с отступами (порядка 40 пикселей) сверху, снизу, от левого и правого краев основного текста.
Работа с графическими изображениями
- SRC - полное имя вставляемого файла относительно папки, в которой находится данный html-документ. В web-страницах, как правило, используются только графические изображения в форматах .jpg и .gif.
- BORDER – ширина рамки для рисунка: в пикселях.
- WIDTH и HEIGHT - ширина и высота рисунка (в пикселях). Если данные атрибуты не указаны, рисунок выводится в реальном масштабе; если указан только один из данных атрибутов, вторая характеристика рисунка меняется пропорционально.
- ALIGN - установка обтекания рисунка текстом, указание на размещение рисунка относительно текста: right или left.
- ALT - указание текстовой подсказки при наведении на рисунок курсора мыши.
- HSPACE и VSPACE - горизонтальный и вертикальный отступы от рисунка до окружающего его текста.
- построение горизонтальной линии, атрибуты:
- WIDTH - ширина линии: в пикселях или в процентах от рабочей области (по умолчанию - 100%).
- SIZE – толщина линии: в пикселях (по умолчанию - 2).
- ALIGN – горизонтальное выравнивание линии: left, center (по умолчанию), right.
- COLOR – цвет линии.