Таблицы в HTML-документе

  • doc
  • 12.04.2020
Публикация в СМИ для учителей

Публикация в СМИ для учителей

Бесплатное участие. Свидетельство СМИ сразу.
Мгновенные 10 документов в портфолио.

Иконка файла материала 26. Таблицы в HTML-документе.doc

Практическая работа № 3

Тема: Таблицы в HTML-документе

Цель: закрепить знания по использованию таблиц для структурирования сайтов.

Задачи: рассмотреть тэги <table>, <tr>, <td> и их атрибуты.

Время выполнения: 2 часа

Теоретический материал:

Тег <table> создает таблицу. Все прочие элементы таблицы должны быть вложенными в него. Допускается также вложение таблиц одна в другую. Закрывающий тег обязателен. Атрибуты:

align – выравнивание таблицы относительно документа (center, left, right);

background – определяет рисунок для фона;

bgcolor – определяет цвет фона таблицы;

border – толщина рамки в пикселах;

bordercolor – цвет рамки;

cellspacing – задает расстояние между ячейками таблицы;

cellpadding – задает расстояние между содержимым ячейки и ее рамкой;

rules - описывает вид рамки вокруг таблицы. Может принимать следующие значения:

all

отображает все части рамки внутри таблицы

cols

отображает все вертикальные рамки внутри таблицы

none

удаляет все рамки вокруг таблицы

rows

отображает все горизонтальные рамки внутри таблицы

title – всплывающая подсказка;

width - ширина таблицы в процентах или пикселах.

Тег <tr> и необязательный парный ему </tr>, определяет строку в таблице. Тег <td> определяет отдельную ячейку в таблице.

Задания:

1. В соответствие с ходом работы создайте сайт Корпорации монстров. Схема и пункты меню представлены на рисунке 9

САЙТ КОРПОРАЦИИ МОНСТРОВ

История

Мы запугаем вас до полусмерти!

Услуги

Рейтинг лучших монстров

Рисунок 9 – Образец сайта для выполнения 1 задания

2. Расположите на web-странице следующие таблицы:

      

Рисунок 10 – Образцы таблиц для задания 2

Ход работы:

1.       В первом задании сайт должен состоять из семи файлов: 1) описывает общую структуру сайта; 2) содержит заголовок; 3) представляет собой меню на основе гиперссылок; 4) содержит лозунг и приветствие; 5) файл с историей корпорации (необходимо написать пару абзацев); 6) описывает услуги компании с ориентировочными ценами; 7) представляет рейтинг монстров (можно с фотографиями).

2.       Описание работы сайта: при активации ссылки из меню в правую часть должен загружаться соответствующий файл. Заголовок сайта должен быть ссылкой на исходную страницу.

3.       Все страницы сайта должны быть оформлены в едином стиле.

4.       Во втором задании при создании таблиц необходимо сохранить расположение ячеек и форматирование.

Контрольные вопросы:

1.       В чём заключается преимущество использования таблиц для создания шаблона страницы?

2.       Опишите тэг для создания ссылок и его атрибуты.

3.       Укажите тэги создающие таблицы. Опишите атрибуты тэгов.

4.       Охарактеризуйте структуру сайта на основе таблиц.


Скачано с www.znanio.ru