CSS — различия между версиями

Текущая версия на 12:55, 4 августа 2008

CSS (Cascading Style Sheets) — каскадные таблицы стилей. Служат для оформления преимущественно HTML документов, но в общем, предназначены для использования в любом XML-документе, который требует форматирования, например документа в форматах:

XHTML;
XML-Docbook ;
XUL (для оформления элементов графического интерфейса в браузере Mozilla).

Содержание

1 Введение
2 История
3 Подключение CSS к документам
- 3.1 HTML
- 3.2 XML
4 Ссылки

Введение

Сценарий использования CSS приблизительно следующий: входной XML- или HTML- документ разбирается на иерархическое дерево элементов (в соответствии с их вложенностью). Например, в спецификации CSS приводиться следующий пример HTML-документа:

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
 <НTML>   
   <TITLE>My home page</TITLE>
   <BODY>
     <H1>My home page</H1>
     <P>Welcome to my home page! Let me tell you about my favorite
 		composers:
     <UL>
      <LI> Elvis Costello
      <LI> Johannes Brahms
      <LI> Georges Brassens
     </UL>
   </BODY>
 </НTML>

и соответствующему ему дерева (обратите внимание, что недостающие элементы достраиваются в соответствии с DTD-документа):

Далее, в зависимости от конечного устройства (media, устройства, на котором нужно представить документ), выбирается модель форматирования:

В соответствии с этой моделью выбираются наборы инструкций из подключенных CSS-листов, объявленных для данной модели форматирования. CSS-листы состоят из набора инструкций, каждая инструкция состоит из селектора (определяет, к какому узлу документа применяется инструкция) и определений атрибутов (какие атрибуты, в рамках данной модели обработки будут определены, и как, для данного узла). На выходе получается иерархическое дерево форматирования документа, каждый узел которого имеет набор атрибутов, определяющих представление документа на выбранном устройстве. Вообще это дерево может быть не изоморфно исходному дереву документа - т.е. некоторые элементы из исходного дерева могут отсутствовать (например, т.к. не воспроизводятся на конечном устройстве), и наоборот, могут присутствовать дополнительные элементы форматирования. Далее, программа (обычно называемая браузером) показывает (или озвучивает) это атрибутированное дерево документа.

История

Уровень 1 (CSS1): Рекомендация W3C принята 17 декабря 1996 года, пересмотрена 11 января 1999 года.
Уровень 2 (CSS2): Рекомендация W3C принята 12 мая 1998 года. Построена на CSS1 с сохранением обратной совместимости.
Уровень 2.1 (CSS2.1): Кандидат Рекомендации W3C от 25 февраля 2004 года. Построена на CSS2, содержит исправления ошибок.
Уровень 3 (CSS3): Рабочая версия.

Подключение CSS к документам

HTML

CSS можно включать в HTML двумя способами:

Непосредственно в HTML документе:

        <style type="text/css">
        body { 
          color: red;
        }
        </style>

Ссылка в HTML, а CSS в отдельном файле:

        <link href="style.css" rel="stylesheet" type="text/css">

XML

К XHTML можно подключать аналогично HTML, но у любого XML-документа есть дополнительный способ: инструкция «xml-stylesheet». Например, для документа в формате XML-Docbook:

 <?xml version='1.0' encoding="windows-1251"?>
 <?xml-stylesheet href="cis-docbook.css" type="text/css"?>
 <!DOCTYPE book PUBLIC "-//OASIS//DTD DocBook V5.0/EN"
                "http://www.oasis-open.org/docbook/xml/5.0/docbook.dtd" [ ]>
 <article><title>Инструкция по информационной безопасности</title> 
    <abstract><para>Данная инcтрукция по информационной безопасности 
                    обязательна к прочтению всеми сотрудниками компании.</para></abstract>
    <para>  
       <emphasis>Никогда</emphasis> не включайте компьютер без разрешения системного администратора!
    </para>  
 </article>

Где cis-docbook.css содержит следующие правила:

para              { display: block }
abstract para     { display: block;   font-style: italic; }
emphasis          { display: inline;  font-style: upright; }

Ссылки

Любые правки этой статьи будут перезаписаны при следующем сеансе репликации. Если у вас есть серьезное замечание по тексту статьи, запишите его в раздел «discussion».

Репликация: База Знаний «Заказных Информ Систем» → «CSS»

Персональные инструменты

Просмотры