- •Введение в язык html
- •1. Понятие о html
- •2. Понятие о гипертексте
- •3. Понятие о html-файле
- •4. Понятие о тегах языка html
- •5. Структурные теги
- •6. Создание шаблона html-документа и первой Web-страницы
- •Тема 2: Основная часть Web-страницы План
- •1. Использование заголовков
- •2. Символы разрыва абзаца и разрыва строк
- •4. Форматирование текста с помощью стилей
- •5. Добавление линий и комментариев
- •Тема 3: Создание таблиц План
- •1. Начальный этап создания кода таблиц
- •2. Создание строк и столбцов таблицы
- •3. Выбор типа таблицы
- •4. Выравнивание данных в ячейках таблицы по горизонтали и вертикали
- •5. Окрашивание таблиц и рамок
- •Тема 4: Создание списков План
- •1. Списки как инструмент структурирования. Типы списков
- •2. Нумерованные списки
- •3. Маркированные списки
- •4. Списки определений
- •5. Вложение и комбинирование списков
- •Тема 5: Использование фреймов План
- •1. Идея использований фреймов
- •2. Создание фреймов
- •3. Загрузка страниц в фреймы
- •4. Настройка фреймов
- •Тема 6: Гипертекстовые ссылки План
- •1. Типы гиперссылок
- •2. Понятие об url и их использование
- •3. Создание гиперссылок на другие Web-страницы
- •4. Создание внутренних ссылок в документе
- •5. Создание ссылок на ресурсы мультимедиа и на адреса электронной почты
- •6. Загрузка страниц в различные фреймы
- •Тема 7: Графика в Web План
- •2. Выравнивания текста относительно изображения
- •3. Плавающие изображения. Поля вокруг изображений
- •4. Определение ширины и высоты изображения
- •5. Обтекание изображений текстом
- •Тема 8: Использование графики, цвета и текста План
- •1. Добавление на Web-страницы цветных фоновых изображений
- •2. Добавление на Web-страницы графических фоновых изображений
- •3. Изменение цвета текста и гиперссылок
- •4. Добавление кнопок перемещения
- •Тема 9: Мультимедиа План
- •1. Понятие о гипермедиа-ссылках
- •2. Создание гипермедиа-ссылок
- •4. Создание бегущей строки
- •5. Воспроизведение видеофайлов в окне Internet Explorer
- •Тема 10: Средства создания html-файлов План
- •1. Стандартные html-редакторы
- •1. Стандартные html-редакторы
- •Определения
- •Проверочная работа
- •Проверочная работа
2. Создание строк и столбцов таблицы
Чтобы описать таблицу, нужно указать количество строк и столбцов, а также их расположение.
Для определения одной строки таблицы используется пара дескрипторов <TR> и </TR>. Они сообщают браузеру, что ячейки, определяемые между этими дескрипторами относятся к одной строке таблицы.
Дескрипторы <TH> и </TH> определяют заголовки таблицы.
Дескрипторы <TD> и </TD> определяют содержание ячейки.
С помощью атрибута COLSPAN, содержащегося внутри дескриптора <TH> или <TD>, можно сделать так, чтобы соответствующая ячейка занимала несколько столбцов. Для этого нужно присвоить атрибуту COLSPAN значение, равное числу столбцов, которые должна занимать ячейка. Атрибут ROWSPAN выполняет ту же функцию только для строк.
3. Выбор типа таблицы
Прежде чем переходить к описанию ячеек, нужно определить некоторые общие характеристики таблицы. К ним относятся ширина таблицы, интервалы внутри ячейки, интервалы между ячейками и т.д.
Одной из таких общих характеристик является рамка, т.е. граница, отделяющая таблицу от остальной части документа. Для этого используется атрибут BORDER=n, где n – ширина рамки в пикселях. Атрибут BORDER помещается в дескриптор <TABLE>. Если выбрать значение 0 или вообще опустить данный атрибут, то будет создана таблица без рамки.
Для определения ширины таблицы используется атрибут WIDTH, также помещенный в дескриптор <TABLE>. Значение ширины указывается либо в процентах, либо в пикселях, и заключается в кавычки.
С помощью атрибута COLS, помещенного в дескриптор <TABLE>, можно определить количество столбцов таблицы:
<TABLE BORDER=0 WIDTH="50%" COLS="3">.
И, наконец, для определения интервалов в таблице используются атрибуты CELLSPACING и CELLPADDING, помещенные в дескриптор <TABLE>. Атрибут CELLSPACING определяет расстояние между ячейками в пикселях (стандартное значение равно 2).
Атрибут CELLPADDING определяет расстояние в пикселях между содержимым ячейки и ее границами (стандартное расстояние равно 1).
4. Выравнивание данных в ячейках таблицы по горизонтали и вертикали
Атрибут ALIGN позволяет выровнять содержимое ячеек и может принимать значение CENTER, JUSTIFY, CHAR, RIGHT, LEFT.
Если присвоить атрибуту ALIGN значение JUSTIFY, то текстовое содержимое ячейки будет выровнено по ширине.
Если присвоить атрибуту ALIGN значение CHAR, то содержимое ячейки будет выравниваться относительно символа, заданного с помощью атрибута CHAR. Например, запись ALIGN="char" CHAR="," можно использовать для выравнивания натуральных чисел по разделителю дробной части.
Выравнивание данных в ячейках таблицы по вертикали
Атрибут VALIGN может использоваться в контейнере <TR>, <TH>, <TD>. С его помощью можно выровнять текст по верхней или нижней границе ячейки, а также отцентрировать по вертикали. Атрибут VALIGN может принимать следующие значения: TOP, MIDDLE, BOTTOM.
Добавление подписей к таблицам
С помощью контейнера <CAPTION> к таблицам можно добавлять подписи. Таким образом, с помощью подписей можно описать таблицу более подробно, например, добавив информацию о единицах измерения, использованных в таблице.
По умолчанию подписи располагаются над таблицей, но их можно поместить и в другое место. Например, для размещения подписей под таблицей используется следующий код:
<TABLE>
<CAPTION ALIGN=BOTTOM>Это подпись</CAPTION>
Помимо атрибута BOTTOM, в контейнере CAPTION можно использовать атрибуты TOP, LEFT, RIGHT.