Иллюстрированный самоучитель по Adobe Dreamweaver MX

Текст в рамке

Иллюстрированный самоучитель по Adobe Dreamweaver MX › Таблицы › Текст в рамке
Рис. 5.29. Текст в рамке в окне Navigator 4.74.

Видно, что рамка разделена на две половины: светлую и темную.

Что делать? Как заставить Navigator 4.74 отображать рамку нормально? Какой параметр таблицы или ячейки выставить?

К сожалению, ничто нам не поможет – таков уж этот Web-обозреватель… Нужно искать другой путь.

Давайте получше присмотримся к нашей рамке. В самом деле, что это такое? Текст заключен в белый прямоугольник, который находится внутри другого прямоугольника, но уже темно-синего цвета. Естественно, темно-синий прямоугольник больше белого…

Так ведь это две вложенные таблицы!

В самом деле, это так. Попробуем исправить ситуацию. Внешняя таблица имеет невидимую границу (ее толщина равна нулю), темно-синий цвет фона и параметр Cell Padding, равный толщине рамки, которую нам необходимо получить. Внешняя таблица имеет белый фон (это обязательно, т. к. содержимое вложенной таблицы "унаследует" фон от внешней), опять же невидимую границу и параметр Cell Padding, равный нужному нам промежутку между рамкой и текстом. Таким образом, мы обводим проблему с отображением границ таблицы в некоторых программах Web-обозревателях.

Давайте выполним вышесказанное. Но прежде сотрем все содержимое страницы 5.5.htm. Для этого быстрее всего щелкнуть тег <BODY> в секции тегов и нажать клавишу Del.

Создадим новую таблицу шириной 100% и высотой 50 пикселов, с темно-синим фоном и толщиной рамки, равной нулю. Параметр Cell Padding должен быть равен 8 пикселам, а Cell Spacing – нулю. Эта таблица должна содержать одну строку и один столбец. Результат показан на рис. 5.30.

Иллюстрированный самоучитель по Adobe Dreamweaver MX › Таблицы › Текст в рамке
Рис. 5.30. Внешняя таблица

Теперь помещаем текстовый курсор в единственную ячейку этой таблицы и вставляем в нее вторую, внутреннюю, таблицу. Ее ширина и высота должны быть равны 100% (чтобы заполнить всю ячейку), параметр Cell Padding – 4 пикселам, толщина границы и Cell Spacing – нулю. Обязательно зададим белый цвет фона. Эта таблица содержит опять-таки одну ячейку. Готовая комбинация из двух таблиц – внешней и внутренней – показана на рис. 5.31.

Иллюстрированный самоучитель по Adobe Dreamweaver MX › Таблицы › Текст в рамке
Рис. 5.31. Готовая рамка для заголовка, состоящая из двух вложенных одна в другую таблиц

Теперь введем и отформатируем текст заголовка – и опять получим то, что показано на рис. 5.28. Но на этот раз наше творение будет нормально показываться даже в самых капризных Web-обозревателях. Можете проверить!

Это лишь один из фокусов, к которым прибегают опытные Web-дизайнеры. К сожалению, Web-дизайн – пока что еще не столько технология и даже не столько искусство, сколько шаманизм. А действия Web-дизайнера иной раз здорово смахивают на шаманские камлания… разве что без бубна.

Если Вы заметили ошибку, выделите, пожалуйста, необходимый текст и нажмите CTRL + Enter, чтобы сообщить об этом редактору.