Упражнение 4. Табличный дизайн Web- страниц

Т Три созданные ранее Web-страницы теперь нужно переделать. Основой их должна стать таблица с невидимыми границами, построение которой будет продемонстрированно ниже. Это позволит ровно и аккуратно распределить подготовленную информацию по ячейкам. Для таблицы с Хобби возможно задание дополнительной таблицы.

Построение таблиц разметки вручную

Сейчас мы рассмотрим самый очевидный способ построения таблиц разметки. (Самый очевидный, но не самый простой.) Это создание "скелета" нашей страницы вручную, т. е. помещение на Web-странице обычной таблицы HTML и форматирование ее специальным образом. Такой способ идеален для небольших таблиц разметки и, следовательно, для простых сайтов.

Что касается схемы табличного дизайна, то лучше всего подходит схема, классического дизайна.

Переключитесь на новый сайт, создайте новый файл default.htm и откройте его в окне документа Dreamweaver. Откройте диалоговое окно Page Properties. Задайте для новой страницы следующие параметры:

· цвет фона — белый (#FFFFFF);

· цвет текста — черный (#000000);

· цвет гиперссылок — темно-красный (#990000);

· цвет посещенных гиперссылок — темно-серый (#666666);

· цвет активной гиперссылки — ярко-красный (#FF0000);

· название страницы — "Иван И. Иванов".

А теперь поместите на странице таблицу. Таблица эта должна содержать три строки и два столбца и не должна иметь границы. Ширина этой таблицы должна быть равна 100%, т. е. таблица должна занимать все окно Web-обозревателя по ширине; высоту же не задавайте. Все остальные параметры оставьте по умолчанию. Ну а дальше уже подойдите к процессу творчески и сделайте сайт с тремя страницами такого дизайна.


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

  1. Каковы принципы модели таблиц HTML в Adobe Dreamweaver? Как используются таблицы в HTML-страницах?
  2. Как добавляют таблицы в Adobe Dreamweaver? Какие параметры таблиц можно задать на этапе их создания?
  3. Какие параметры таблиц можно задать на этапе их редактирования в Adobe Dreamweaver?
  4. Какие параметры можно задавать для отдельных ячеек таблиц в Adobe Dreamweaver? Почему некоторые значения ячеек не стоит вообще задавать?
  5. Каким образом можно изменять макет таблиц? Как можно добавить и удалить новые ячейки, строки и столбцы в Adobe Dreamweaver?

Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: