Обучение CSS с НУЛЯ

«Введение в CSS» – первый урок учебника CSS. В этом уроке мы начнем обучение CSS и обсудим общие особенности использования каскадных таблиц стилей, такие, как подкючение таблиц стилей, использование комментариев и т.д.

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

Приоритет использования таблиц стилей .

Существует несколько способов задания таблиц стилей:

внутри элемента HTML
внутри элемента <head> страницы HTML
во внешнем файле CSS

Если для некоторого элемента разметки HTML было определено более одного стиля, то ни будут последовательно каскадированны друг на друга по определенным правилам. Приоритет наложения стилей друг на друга представлен ниже:

стили браузера по умолчанию
внешние стили
внутренние стили (стили, расположенные внутри элемента <head>)
стили, присвоенные непосредственно HTML элементам

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

Подключение внешних табиц стилей.

Использование внешних таблиц стилей является наиболее удобным способом организации разметки страниц. Для построения связи с внешней таблицей необходимо конструкцию вида <link rel="stylesheet" type="text/css" href="style.css"> разместить внутри контейнера <head></head> , как это показанно в примере:

После этого создаем файл с названием style.css и прописываем внутри него необходимые css инструкции.

Комментарии CSS.

Для создания комментариев в CSS используется следующая конструкция:

для открытия комментариев служит символ "/*" и символ "*/" – для закрытия.

/* Первый комментарий. */
p
{
/* Второй комментарий. */
{
margin – left: 5pt; font – family: "verdana";
/* Третий комментарий. */
font – style:italic;
}

Как вы и сами видите, комментарии могут быть расположенны в любом месте CSS инструкции.

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

В следующем уроке речь пойдет об основах CSS синтаксиса.

Наверх

Источник: Создание сайтов