|
Оформление таблиц с помощью каскадных таблиц стилейВ этой статье я расскажу, как можно оформить (в смысле - раскрасить:-) таблицы с помощью таблиц стилей. (Дальше, чтобы не наворачивать таблицы на таблицы, я буду говорить просто: "с помощью стилей":-). Предупреждая возможную критику со стороны дизайнеров за слишком аляповатый вид таблицы, обращаю Ваше внимание, что это пример ПОСТРОЕНИЯ таблицы с помощью стилей, но никак не пример для ПОДРАЖАНИЯ! В том смысле, что я лишь показываю, как это делать технически, и цвета и формы выбраны только для иллюстрации возможностей, а не в качестве примера дизайна. О дизайне своих страниц Вы уж, пожалуйста, позаботьтесь сами согласно своим вкусам и наклонностям.Итак, приступим... Все таблицы на этой странице подчиняются следующим правилам стилей, которые помещены в разделе HEAD (правила выделены красным, черным - комментарии): table - ниже перечислены общие правила для всей таблицы { border-bottom: thick; - определяет толщину рамки border-style: ridge; - определяет стиль рамки border-color: green; - определяет цвет рамки background:gray; - определяет цвет фона ячеек (в нижеследующем примере виден лишь в пропущенных ячейках, так как цвет остальных определяется другими правилами. } caption - определяет свойства заголовка таблицы {color:green; - цвет font-family: Arial serif; - шрифт font-size: 200%;text-align:center} - размер шрифта td - общие свойства для всех ячеек {background:#ffffcc; border: thick inset fuchsia;} - цвет фона и свойства рамки th - свойства для заглавных ячеек столбцов {border:thick outset yellow;background-color:#009900} - цвет фона и свойства рамки #solu3 - определяет селектор {background-color:#ccffff; border:thick inset #ffffcc} - определяет свойства фона и рамок ячеек, определенных селектором #solu3 #solu4 - определяет селектор {background-color:#ffccff;border:thick inset #ffffcc} - определяет свойства фона и рамок ячеек, определенных селектором #solu4 Вот, что получается в результате:
Как видим, с помощью таблиц стилей таблицу можно раскрасить очень ярко Остается добавить, что для оформления таблиц можно использовать правила, предназначенные для собственно таблиц, шрифтов, границ, цвета и фона и некоторых других, которые Вы найдете в разделе вспомогательные материалы. | ||||||||||||||||||||||||||||||
| поиск по сайту и в сети: |
| > |
|
|
|
Copyright © 2001 by Сергей Червонящий.Все права защищены. Запрещено частичное или полное воспроизведение материалов сайта без согласования с автором. |
|
Покупайте на OHO.ru:
|