CSS или каскадные таблицы стилей
Каскадные таблицы стилей это заранее заданные параметры оформления. CSS могут применятся как в документе так и за его пределами (если нам нужно задать один стиль для всех страниц).
Если таблица стилей находится в пределах документа, то этот документ должен иметь такую структуру:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"> <HTML> <HEAD> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <STYLE> P { Font-family=”Arial”; Text-align=”right”; Color=”#00008B”; Font-size=”12px”; Text-imdent=”30px” } .class { Font-family=”Arial”; Text-align=”right”; Color=”#00008B”; Font-size=”22px”; Text-indent=”30px” } </STYLE> </HEAD> <BODY> <p>Привет меня зовут Вася</p> </BODY> </HTML>
Для начала общие сведенья CSS
1. Описание тегов или классов только внутри парного тега style.
2. Название описываемого тега (<>) скобки.
3. Свойства тега пишутся внутри “{ }” скобок (сами свойства вы можете найти здесь).
4. Если свойства тегов превышают одного то всех их пишут через “;”.
5. Свойства которые применяются пишутся после ”:”.
6. Если название шрифта более одного слова то его нужно брать в кавычки “Times new roman”
Часто одни и те самые свойства нужно применить к подобным тегам, это можно сделать с помощью классов (.class). Вы конечно заметили, что в надписи “.class” есть точка “.”, именно она и определяет наш класс. Мы увидели как класс применяется в стиле, а теперь рассмотрим как этот же класс применяется в части кода самой таблицы:
<P class=”class”> Привет </P>
Вы наверное уже поняли и сами, по содержанию примера, что класс при использовании пишется без точки перед названием (“class”). Я назвал свой класс “class”, а вы можете назвать класс как угодно, только бы в нем соблюдались правила описанные выше.
Рассмотрим вариант, если таблица стилей находится в отдельном документе:
При этом этот документ должен иметь расширение *. css. А в документе, где будут использоваться каскадные таблицы стилей, должна быть надпись такого плана:
<link href="name.css" type="text/css" rel="stylesheet">
Не буду расшифровывать эту умную надпись (Ее пусть расшифровывают большие и толстые книги), а скажу только, что вместо слова name вы вписываете имя своей таблицы и вписывать эту надпись нужно между тегами <head></head>.
Внутри созданного документа name. css мы вписываем все тоже что и в встроенных в документ таблицах стилей, только без тегов <style></style>.
Пример:
P { Font-family=”Arial”; Text-align=”right”; Color=”#00008B”; Font-size=”12px”; Text-imdent=”30px” } .class { Font-family=”Arial”; Text-align=”right”; Color=”#00008B”; Font-size=”22px”; Text-indent=”30px” }