Стандарты CSS

В этой статье разберемся с такой ключевой темой в веб-дизайне, как стандарты CSS. CSS (Cascading Style Sheets — каскадные таблицы стилей) представляет собой формальный язык описания внешнего вида документа, написанного с использованием языка разметки. Это определение из Википедии.

• Стандарты CSS.
• Применение CSS.
• Использование CSS.
• Каскадные таблицы стилей.

Эти термины часто встречаются в различных пособиях по созданию сайтов. Что они обозначают, где и как используются, я постараюсь Вам рассказать на этой странице, вернее этой теме придется посвятить несколько страниц, так как для одной страницы материала будет многовато.

При создании сайта на языке HTML веб-дизайнеру очень часто приходится  заниматься описанием  и форматированием страницы, используя повторяющиеся блоки тегов — директив этого языка.

Если текст содержит десяток абзацев и плюс еще несколько иллюстраций, которые необходимо разместить, выровнять, определится с цветом текста, фона и еще чего-нибудь.

Эта работа будет достаточно трудоемкой и рутинной. Да еще и объем результирующего файла будет расти, что негативно скажется на скорости загрузки.

Назначение стандарта CSS

Именно для решения этих проблем и был создан стандарт CSS (Cascading Style Sheets – Каскадные таблицы стилей).  Этот стандарт дополняет и расширяет язык HTML и значительно облегчает верстку веб-страниц.

Принцип CSS следующий – один раз, описав свойства какого-нибудь элемента в текстовом файле с расширением .css, использовать это описание, подключая этот файл к документу HTML.

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

Эта технология облегчает не только разработку, но и изменения, которые проводят веб-мастера, развивая свои сайты. Достаточно изменить несколько операторов в файле css, чтобы добиться нужного результата.

Можно конечно возразить, что в современных условиях массового применения различных систем управления контентом это не столь важно. CMS сама настраивает и формирует стили, в зависимости от выбранного шаблона. Но тому, кто хочет ориентироваться в техпроцессе создания сайтов, это точно не помешает.

Допустим у Вас сайт на WordPress или Joomla и Вас не устраивает какой-то элемент дизайна, величина шрифта, цвет фона и тому подобное. Шаблон или тему вы менять не планируете, уже настроили ее, привыкли, она Вас вполне устраивает. Вы хотите только подправить некоторые элементы. Что делать?

У Вас как минимум два варианта. В первом случае необходимо обратится к программисту, который за определенную сумму удовлетворит Ваши запросы. Во втором случае Вы это делаете самостоятельно, найдя нужный файл и изменив необходимые операторы.

Директивы стандарта CSS

Стандарт CSS содержит следующие виды директив:

Селекторы или еще их называют селекторы элементов

. Ими могут быть обычные теги языка HTML.

Классы или селекторы классов.

Ими тоже могут быть различные теги HTML, но одному виду тегов можно присвоить несколько стилей, задав им разные имена.

Идентификаторы или селекторы по ID

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

Псевдоэлементы

, применяются для выделения первой буквы параграфа или для выделения первой строки параграфа.

Псевдоклассы

, применяются для формирования стиля оформления ссылок, как отображаются ссылки посещенные, не посещенные, активные или ссылки с наведенной на нее мышью.

Комментарии

, содержат пояснения авторов о содержании того или иного блока или группы операторов. Они заключаются в в последовательность символов «/» и «*».
/*   текст комментария */

На этом позволю себе прерваться, обязательно продолжим в следующих статьях разбираться с селекторами и их свойствами. Это несложно и может пригодиться при работе над нашими сайтами.
Спасибо за внимание, до следующих встреч.

8 комментариев на “Стандарты CSS”