|
|
Библиотека Интернет Индустрии I2R.ru |
||
Все в своих рамках В
своё время, только начиная изучать азы Web-дизайна, я столкнулся с проблемой смехотворной,
но знакомой каждому начинающему Web-мастеру: как расставить на странице все элементы
так, чтобы они гармонично сочетались и, при этом, не мешали друг другу. .
С теми же параметрами, что и у строки. Кроме того, существуют еще и теги, позволяющие
в самом коде делить таблицу на соответствующие разделы: THEAD, TH, TBODY
и TFOOT. При этом, ТН уже содержит в себе форматирование, позволяющее выделять
жирным и выравнивать по центру текст заголовка таблицы. Правда, всё это имеет
смысл, если таблица создается с целью именно показать таблицу в HTML-документе.
В самом простом варианте (с учётом всех вышеуказанных тегов) табличный код выглядит
вот так: |
Всё это проще простого, скажете Вы. И что здесь сложного и опасного? Во-первых, опасность в параметрах. Не все параметры стоит применять, так же, как и не все параметры из тех, что следовало бы, мы применяем. Так, например, для тега TR не обязательно применение параметров выравнивания. Однако они обязательны (!) для применения с тегом TD. Также типичная ошибка, с тегами TR, TD и TH может не применяться параметр WIDTH, однако он очень важен, так влияет на соответствие расположения ячеек в таблице относительно друг друга и таблицы в целом. Таким образом, создавая таблицу, необходимо указать ширину самой таблицы (а иногда и её высоту - для "благозвучности" дизайна), ширину строки и ячейки/ячеек, горизонтальное выравнивание таблицы и ячейки, а также расстояние между ячейками и внутри-ячеечные отступы. При этом ширина каждой ячейки в строке, если их несколько, должна соответственно быть указанна так, чтобы их сумма соответствовала ширине строки. Однако если указать ширину ячеек, но опустить ширину строки, то может появиться неприятный эффект - "съедание" объектов (например, кнопок HTML), расположенных в ячейках. Прошу обратить внимание на параметр COLSPAN, присутствующий в ячейках заголовка и заключения таблицы. Он применяется, когда ячеек в строках больше одной и указывает, на ширину скольких колонок растянется данная ячейка. Параметр, аналогичный ему и касающийся количества "перекрываемых" строк, называется ROWSPAN. Пропуск этих параметров, там, где они необходимы, является очень частой ошибкой и приводит к искажению получаемого в браузере изображения. Кроме основных параметров, в табличных тегах могут применяться дополнительные, которые особенно не влияют на правильное форматирование таблицы. Это стандартные HTML-параметры фонового цвета, цвета рамки (основной, "светлой" и "темной"), параметры STYLE и CLASS каскадных таблиц стилей. Здесь важно не ошибиться с использованием цветов и стилей, чтобы ваша таблица выглядела гармонично и не колола глаза пестротой и неопрятностью дизайна. Также, нужно учитывать, что Netscape Navigator по умолчанию использует для оформления рамки таблицы объемную линию. Он может частично "покрасить" её в указанный вами цвет, но не признает "светло-темного" варианта. Во-вторых, опасность скрывается в самих таблицах. Нередко, создавая дизайн страницы с помощью таблицы, мы забываем, что ячейки намертво связаны друг с другом. Даже COLSPAN/ROWSPAN не позволяют нам освободиться полностью от тех рамок, в которые нас загоняют столбцы и строки таблицы. А ведь дизайн требует, чаще всего, "вольного" расположения элементов на странице. В этом случае необходимо прибегнуть к "методу Матрёшки", при котором основная таблица является всего лишь носителем других, функционально значимых таблиц, в которых и располагаются элементы дизайна. На примере это выглядит следующим образом:
| |||||||||||||||||||||||||||||||||||||||||||
