|
Теперь, перейдем к каскадной таблице стилей, и предадим нашей таблице кое-какой внешний вид. Для начала, добавим класс .table наше таблицу, и идентификатор #title для ячейки с название нашей таблицы. Code <table class=”table” cellpadding="0" cellspacing="0" boder=”0 <tr> <td id=”title” colspan=”2”>Название таблицы</td> </tr> Теперь, в нашем CSS документе пропишем стили для данной таблицы: Code .table { border-bottom:1px solid #ccc; border-left:1px solid #ccc; font-family:Tahoma; font-size:12px; color:#333333} .table td { padding:6px; border:1px solid #fff; border-top: 1px solid #ccc; border-right: 1px solid #ccc; background-color:#f5f5f5} .table #title { font-family:Trebuchet MS; font-size:14px; text-shadow:1px 1px 0px #fff} Где у нас значение селекторов:
Code .table // основной стиль таблицы Code .table td // стиль всех ячеек таблицы .table #title // стиль ячейки названия таблицы И значение атрибутов: border-bottom:1px solid #ccc; border-left:1px solid #ccc — обводка с низу и с лева; font-family:Tahoma; font-size:12px; color:#333333 — шрифт, размер и цвет текста; padding:6px — отступы внутри ячеек; border:1px solid #fff — общая обводка белого цвета; border-top: 1px solid #ccc; border-right: 1px solid #ccc — обводка с верху и с права серого цвета; background-color:#f5f5f5 — цвет заднего фона; Почему же, у нас сначала указана общая обводка, а затем обводка с верху и с права? Потому, что то, что идет после общей обводки имеет высший приоритет. Мы так же могли прописать обводку с лева и с низу, но это заняло бы большее место. font-family: Trebuchet MS; font-size:14px — шрифт и размер текста; text-shadow:1px 1px 0px #fff — тень у текста;
мои записи и на Я.ру 30306778.38452326.1351063807.0b00d70d238d83e2005afa1230b8e22d
| 
Меню сайта
Меню сайта
