| | | | | | | | | | | | | | | | | | | | | |
| Наши Друзья |
|
|
|
|
 | [Весь Текст] |
| |  | |
|
| |
>3Ta область содержит
1
навигационный
MaccHB
|
B этой области находится содержимое
Web-CTpaHnuK
|
|
Глава 2. HTML-таблицы 123
.8е .dft У»«м : Favorites Tools
J
Stop Refresh
это:;/,
J
n! My Compute!
Рис. 2.28. Web-страница с имитацией фреймовой структуры с помощью таблицы
Используя различные фоновые цвета для каждого раздела (в данном примере
красный, синий и черный), можно сделать так, что каждый раздел будет смот-
реться как независимый - подобно фреймам на фреймовой Web-странице.
Привлечение внимания посетителя
с помощью цвета фона ячеек
В этой главе вы узнали, что основные способы применения таблиц в Web-до-
кументе включают отображение табличных данных, организацию и размещение
содержимого в определенных местах, создание навигационных карт и экономию
времени, затрачиваемого браузером на загрузку графических изображений. Кроме
того, таблицы можно использовать для привлечения внимания посетителей сай-
та и, следовательно, для притягивания их взглядов к отдельным областям Web-
страницы. Цвет — мощное средство, с помощью которого можно завладеть вни-
манием посетителя, В предыдущем практикуме вы работали с фоновым цветом
для создания групп ячеек, делящих Web-страницу на области, имеющие различ-
ное назначение.
Теперь предположим, что вы создаете документ, содержащий большое количе-
ство текста, и хотите, чтобы посетитель уделил особое внимание одному опреде-
ленному абзацу. Создайте таблицу с множеством ячеек и поместите текст Web-
страницы в одну из ячеек таблицы. Затем окрасьте ячейку слева от "важного"
абзаца и, может быть, даже поместите в цветную ячейку какой-нибудь описа-
тельный текст, например, как показано на рис. 2.29.
124 Глава2. HTML-таблицы
'• " ' • ' - " • • - • •••.•••• • • • ' - г » « .
Fife .dl View Favorite» X™ • Help
J
Stop Seach . Favorites:
Смотри сюда!
Текст основной части
документа находится здесь.
Вся информация, которую
должна
отображать ваша Web-страница
Важная информация, которую
ваши читатели
должны увидеть, подсвечена
ярко-желтым цветом.
m
Рис. 2.29. Таблица с цветной ячейкой, притягивающей взгляды
к определенной области Web-страницы
Приведенный ниже код создает Web-документ, показанный на рис. 2.22:
|
Текст основной части документа находится здесь.
Вся информация, которую должна<Ьг>
отображать ваша Web-страница.
Важная информация, которую ваши читатели<Ьг>
должны увидеть, подсвечена<Ьг>
ярко-желтым цветом.
|
|
Смотри crafla!
|
Изменение цвета фона ячейки таблицы, содержащей слова "Смотри сюда!" на
желтый (за счет установки атрибута bgcolor в дескрипторе | ячейки равным
''yellow") привлекает внимание посетителя к ячейке и делает акцент на фраг-
менте текста в смежной ячейке.
Визуальное выравнивание содержимого Web-страницы
с помощью видимых границ таблицы
Выравнивая с помощью таблицы графику и текст, вы создаете организован-
ную структуру страницы, что помогает глазам посетителя двигаться по документу
и повышает привлекательность компоновки страницы.
Глава 2, HTML-таблицы 1 2 5
ПРАКТИКУМ
Предположим, например, вы хотите создать Web-страницу, содержащую фотогра-
фии ваших сотрудников вместе с их именами и фамилиями, должностями, зани-
маемыми в компании, и почтовыми адресами. Чтобы организовать эту информа-
цию, создайте таблицу, состоящую из одного столбца, как показано на рис. 2.30.
Строка 1 содержит имя и фамилию сотрудника, строка 2 — фотографию со-
трудника, строка 3 — должность, занимаемую им/ею в компании; строка 4 —
его/ее почтовый адрес. Применение таблицы не только помогает организовать
информацию на Web-странице, но, вдобавок к этому, использование атрибута
border дает возможность еще более наглядно определить внешнюю границу таб-
лицы и отделяет таблицу от прочей графики и текста на Web-странице.
Показанная на рис. 2.30 таблица создается при помощи следующего кода:
|
