HTML (HyperText Markup Language) - Язык Разметки Гипертекста
Создание Web-страниц. Основные теги языка HTML.Основные теги языка HTML. Атрибуты таблицы. Графические элементы.
Структура простого HTML-документа Моя первая страничка... прочие теги и текст... содержание
Основные теги языка TML. Тег Основной тег документа. Не содержит атрибутов. Все прочие теги строятся в области действия данного тега. Тег парный. Тег "Голова" HTML-документа. В нем располагаются теги заголовка-названия документа и различная вспомогательная информация, такая как язык документа и имя автора. Тег парный. Содержит заголовки HTML- документа. Также не содержит атрибутов. Тег Определяет название страницы. Браузер показывает его в заголовке окна при открытии страницы. Тег парный. Тег Отмечает начало и конец непосредственно содержимого веб-страницы. Тег парный. Основные атрибуты: bgcolor - цвет фона страницы background - фоновый рисунок содержание
Форматирование текста Тег Задает параграф в тексте. Тег парный. Основной атрибут: align - выравнивание текста Пример: текст по правому краю содержание
Тег Определяет границы нумерованного списка. Тег парный. Тег Определяет границы ненумерованного списка. Тег парный. Тег Определяет элемент списка (нумерованного или ненумерованного). Тег парный. Списки содержание
Пример: Москва Рим 1.Москва 2.Рим 3.Париж содержание
Тег Задает шрифт для блока текста. Тег парный. Атрибуты: face - начертание(шрифт) color - цвет size - размер Пример: этот текст будет зеленого цвета содержание
Тег Выделяет блок текста жирным шрифтом. Тег парный. Тег Выделяет блок текста курсивным шрифтом. Тег парный. Тег Переводит каретку на новую строку. Тег не парный содержание
Таблицы: содержание
Тег Описывают границы таблицы. Тег Описывают строки таблицы. Тег Описывают столбцы таблицы. В каждой строке должно быть одинаковое количество ячеек. содержание
Основные атрибуты Основные атрибуты border - толщина рамки. Задается в пикселях (единицах измерения экрана). Пример: border="1" width - ширина таблицы. Может задаваться в пикселях, а может в процентах (от размера окна, в котором просматривается страница). height - высота таблицы. Как и в предыдущем случае, может задаваться в пикселях, а может в процентах. align - выравнивание информации в ячейке по горизонтали. Значения: left (по умолчанию), center, right. background - путь к фоновой картинке. Например: "/images/back.gif". bgcolor - цвет фона. Как и цвет шрифта может содержать код цвета или его имя. содержание
Основные атрибуты и Основные атрибуты и align - выравнивание по горизонтали. valign - выравнивание вертикали. background - фоновый рисунок. bgcolor - цвет фона. colspan - количество занимаемых ячейкой колонок. rowspan - количество занимаемых ячейкой строк. height - высота ячейки. width - ширина ячейки. содержание
Пример 1: Ячейка 1 Ячейка 2 Ячейка 3 Ячейка 4 Ячейка 1Ячейка 2 Ячейка 3Ячейка 4 содержание
Пример 2: Ячейка1 Ячейка3 Ячейка 4 Ячейка 1 Ячейк а3 Ячейк а4 содержание
Пример 3: Ячейка 1 Ячейка 2 Ячейка 4 Ячейка 1Ячейка 2 Ячейка 4 содержание
Пример 4: Ячейка 11 Ячейка 12 Ячейка 13 Ячейка 21 Ячейка 23 Ячейка содержание
Работа с изображениями В HTML-документах, помимо текста и таблиц, можно использовать графику. HTML, а точнее браузеры поддерживают три формата графических файлов: JPG, GIF, PNG.JPGGIF PNG содержание
JPG - предназначен для хранения полноцветных фотографий. JPG - формат кодирования изображений с потерей, т.е. при сжатии картинки в JPG-файл часть (не существенная) информации отбрасывается за ненадобность. содержание
GIF - предназначен для хранения картинок с ограниченной цветовой палитрой (256 цветов). содержание
PNG - универсальный формат, специально разработанный для передачи изображений через сеть. PNG - формат сжатия без потери качества. содержание
тег -вставка картинки Основные атрибуты: src - источник картинки, src="sample_image.jpg"; width - ширина картинки, width="119"; height - высота картинки, height="89"; alt - подсказка для картинки, alt="кнопка"; border - толщина рамки, border="0". содержание
Использование картинок в качестве фонового заполнения Для страницы, таблицы и ячейки используется один и тот же атрибут - background, который указывает местоположение картинки-фона: background="sample_image.jpg". содержание