Большой архив статей, книг, документации по программированию, вебдизайну, компьютерной графике, сетям, операционным системам и многому другому
 
<Добавить в Избранное>    <Сделать стартовой>    <Реклама на сайте>    <Контакты>
  Главная Документация Программы Обои   Экспорт RSS E-Books
 
 

   Интернет технологии -> CSS -> CSS - Справочник


Синтаксис

Общие файлы таблиц стилей для нескольких документов

Файл таблиц стилей - это просто текстовый файл с расширением .css. Такой файл может быть подключен к любому количеству документов HTML. Эти документы даже могут располагаться на другом сервере.

При изменении параметров (значений свойств) в файле таблиц стилей, изменется внешний вид всех документов HTML, к которым подключен данный файл стилей.

Все легче понять на примере. Так может выглядеть файл таблиц стилей (syntax_101.css):

H1 {
font-size : 32px;
color : red;
}

div.italic {
font-style : italic
}

.strong {
font-size : +1;
font-weight : bold;
}

Здесь определены 3 стиля: H1, div.italic, .strong. Определение стиля начинается с имени (H1 или div.italic - в первом случае определяется оформление для всех тегов <H1>, во втором для класса). Далее в фигурных скобках перечисляются пары имя свойста : значение. Название свойства от значения свойства отделяются ":". Пары разделяются между собой ";". Одной из особенностью CSS является то, что можно указывать не все возможные пары значений. Если что-то не указать, то значение будет наследоваться или использоваться значение по умолчанию.

Если определен стиль H1, то ко всем заголовкам <H1> будет применяться указанное в определении стиля форматирование.

Теперь можно создать HTML документ (или несколько документов), в котором сослаться на syntax_101.css.

<html>
   <head>
      <title>Новый</title>
      <link rel="stylesheet"
type="text/css" href="syntax_101.css">
   </head>

   <body>
      <h1>Заголовок первого уровня (H1)</h1>
      <div>Это обычный текст      <div class="italic">Фрагмент наклонного текста</div>
      <p class="strong">Какой-то он жирный слишком</p>
   </body>
</html>

Как это выглядит можно посмотреть здесь.

Cтиль .strong может применяться к любым элементам (тегам), достаточно в параметрах этого тега указать class="strong"

Можно присвоить одно свойство нескольким тегам, например установить зеленый цвет для всех заголовков:
H1, H2, H3 {color : green;}

Очень важная особенность CSS - возможнность создания контекстных стилей. Т.е. форматирование элемента может зависеть от его положения в документе. Например, стиль определенный как:

H3 I {color : red;}
будет действовать только на тот текст, выделенный тегами <I>, который расположен внутри заголовка третьего уровня. Это не будет действовать на другие заголовки или выделенный курсивом текст в другом месте документа.

Это просто заголовок второго уровня, в котором последнее слово выделено курсивом.

[  Содержание  ]    [  Дальше  ]

 

 
Интересное в сети
 
10 новых программ
CodeLobster PHP Edition 3.7.2
WinToFlash 0.7.0008
Free Video to Flash Converter 4.7.24
Total Commander v7.55
aTunes 2.0.1
Process Explorer v12.04
Backup42 v3.0
Predator 2.0.1
FastStone Image Viewer 4.1
Process Lasso 3.70.4
FastStone Image Viewer 4.0
Xion Audio Player 1.0.125
Notepad GNU v.2.2.8.7.7
K-Lite Codec Pack 5.3.0 Full


Наши сервисы
Рассылка новостей. Подпишитесь на рассылку сейчас и вы всегда будете в курсе последних событий в мире информационных технологий.
Новостные информеры. Поставьте наши информеры к себе и у вас на сайте появится дополнительный постоянно обновляемый раздел.
Добавление статей. Если вы являетесь автором статьи или обзора на тему ИТ присылайте материал нам, мы с удовольствием опубликуем его у себя на сайте.
Реклама на сайте. Размещая рекламу у нас, вы получите новых посетителей, которые могут стать вашими клиентами.
 
Это интересно
 

Copyright © CompDoc.Ru
При цитировании и перепечатке ссылка на www.compdoc.ru обязательна. Карта сайта.