Атрибуты команды TABLE
В приведенных ниже испытателях приводится более подробное описание действий атрибутов, а главное, на стендах можно пощелкать переключателями, подергать за "веревочки" и сразу увидеть, что из этого получилось.
Атрибуты команды TR HTML-таблица состоит из строк, каждая из которых задается командой
Варьируя атрибутами команды TR, можно установить те или иные свойства одновременно для всех ячеек строки.
Атрибуты команды TD (TH) Каждая табличная строка состоит из ячеек, которые последовательно описываются командами TD (обычная ячейка) и (или) TH (ячейка-заголовок):
Содержимое обычной ячейки по умолчанию горизонтально выравнивается по левому краю, а ячейки-заголовка -- по центру. Кроме того, текст в ячейке-заголовке выделяется полужирным шрифтом. Команды TD и TH имеют следующие атрибуты:
Многоликие таблицы Как уже говорилось, использование таблиц в практике HTML-программирования очень неожиданное. Вероятно, авторы языка и не предполагали, что таблицы будут использоваться проектировщиками гипертекстовых страниц как элемент дизайна. Страничные отступы В обычных книгах текст не начинается с самого края -- страничные поля выделяют информационные блоки и, следовательно, помогают глазам более комфортно воспринимать материал. В гипертекстовом документе можно создать поля, если размещать информацию внутри таблицы, состоящей всего из одной клетки с невидимыми границами. При изменении значения атрибута cellpadding, меняется ширина полей.
Можно задать поля и при помощи пустых столбцов:
Обычной практикой является комбинирование этих двух способов:
Один из примеров табличных отступов вы видите сейчас на экране. В качестве страничного фона использована картинка с вертикальной надписью "Robotland" по левому краю. Для того чтобы элементы страницы не налезали на этот "корешок", все они выводятся на экран внутри таблицы так, как это показано в следующем примере.
Замечание Не рекомендуется моделировать страничный отступ при помощи таблиц для больших документов. Во-первых, прорисовка документа, "погруженного" в таблицу начинается только после его полной загрузки. Пауза перед чистым экраном действует на пользователя самым отрицательным образом. Во-вторых, браузеры Netscape на таких табличных страницах "теряют ориентацию" при возврате из гиперссылки. Пользователь щелкает на ссылке, браузер показывает новый документ, а точность возврата к старому месту уже проблематична.
Многоколонная верстка Используя таблицы, можно выводить на экран информацию в несколько колонок:
Наложение картинок Еще одна необычная практика использования таблиц: построение коллажей. Постановка задачи. Имеются две картинки: Как их наложить друг на друга? Как поместить животное на экран телевизора? Общая идея: первую картинку сделать фоном для таблицы, а вторую разместить внутри. Построим таблицу, состоящую из одной клетки. Укажем для этой клетки ширину, равную ширине рисунка, который будем использовать как фон: Да... Получилось не очень хорошо. Для задания высоты ячейки (и таблицы) создатели HTML не придумали атрибута. Мы видим только верхний кусочек фоновой картинки. Идея: использовать еще одну вспомогательную картинку. По высоте она должна равняться фоновой, а по ширине должна быть такой, чтобы закрывать часть телевизора. Тогда лось, расположенный вслед за вспомогательной картинкой попадет в центр экрана. Нарисовать вспомогательную картинку очень просто -- это должен быть одноцветный GIF, в котором единственный цвет объявлен прозрачным. Тогда пользователь на экране эту картинку и не увидит: Замечание На самом деле рисовать невидимый GIF можно любой величины. Оптимальной является картинка в один пиксел. Ведь мы всегда можем указать экранные размеры в команде IMG, и наша вспомогательная картинка будет растягиваться до нужного размера. Искажений можно не опасаться -- их не будет, а кроме того, эту картинку нельзя увидеть на экране ни в какую лупу! Для того, чтобы использование невидимой картинки empty.gif (из каталога pic) было более понятным, ниже она заменена на такую же однопикселную картинку empty1.gif, но без режима "прозрачности", а картинка с лосем показана с рамкой:
Таблицы стилей Уровни CSS Впервые каскадные таблицы стилей CSS были реализованы в браузере Internet Explorer 3.0. Однако в то время развитие CSS находилось в зачаточном состоянии, поэтому правила составления стилевых шаблонов были весьма разрозненными. С момента своего возникновения структура CSS была несколько раз пересмотрена, в нее были добавлены новые элементы и убраны (видоизменены) старые. Существуют три уровня CSS, определяемых наличием завершенной редакции структуры. Это: CSS 1 (первый уровень структуры стилевых шаблонов, окончательно утвержденный 11 января 1999 года), CSS 2 (второй уровень стилевых конструкций, начало обсуждения которого датируется маем 1998 года) и CSS 3 (третий уровень стилевого оформления электронных документов, принятый к обсуждению 23 мая 2001 года, на момент написания книги находился в стадии проработки). В завершение разговора об уровнях CSS следует добавить, что переход от одного уровня к другому, в основном, сопровождался некоторыми видоизменениями в структуре и в правилах стилевого оформления, технологическими дополнениями, а также попытками систематизировать применение CSS. Именно третий уровень (CSS 3) позиционируется разработчиками в качестве некой единой системы представления стилей в электронном документе, основанной на использовании специальных модулей.
Популярное: Организация как механизм и форма жизни коллектива: Организация не сможет достичь поставленных целей без соответствующей внутренней... Как построить свою речь (словесное оформление):
При подготовке публичного выступления перед оратором возникает вопрос, как лучше словесно оформить свою... ©2015-2024 megaobuchalka.ru Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. (244)
|
Почему 1285321 студент выбрали МегаОбучалку... Система поиска информации Мобильная версия сайта Удобная навигация Нет шокирующей рекламы |