CSS (Cascading Styles Sheet) или Каскадные таблицы стилей – это технология, позволяющая определять стили для документов HTML. В связи с тем, что HTML – это содержимое или контент, каскадные стили – это его визуальное представление.
Демо: Одна страница - несколько стилей!
Ниже приведена веб-страница с несколькими стилями. Чтобы увидеть разные стили, нажмите на соответствующую ссылку:
Для чего используется CSS?
CSS используется для определения визуальных стилей веб-страниц. Сюда входят дизайн элементов, макет или раскладка, а также варианты внешнего вида страницы при отображении на разных устройствах и при разных размерах экрана.
Пример CSS
body {
position: relative;
font-family: arial, serif;
}
p {
padding-top: 10px;
}
h1 {
font-weight: bolder;
}
CSS решил одну Большую Проблему
HTML изначально НИКОГДА не предназначался для визуального оформления веб-страницы!
HTML создавался для описания содержимого веб-страницы:
<h1>Большой заголовок</h1>
<p>Параграф или абзац.</p>
Когда в спецификацию HTML 3.2 были введены такие теги как <font> для определения шрифтов и атрибуты вроде color для определения цвета, веб-разработчики погрузились в сплошной кошмар. Разрабатывать большие проекты, где данные о шрифтах и цветах добавлялись на каждую страницу, стало долго и дорого.
Для решения данной проблемы Консорциум W3C и создал язык CSS.
CSS убрал определение стилей из кода веб-страницы!
Если вы не знакомы с языком HTML, то мы советуем сначала изучить наш Учебник HTML для начинающих.
CSS значительно экономит время!
Обычно стили хранятся во внешних файлах с расширением .css.
Внешние каскадные таблицы стилей позволяют изменить оформление целого сайта внося изменения только в один файл!
Как и учебник "HTML для начинающих", этот учебник "CSS для начинающих" не требует от читателя каких-либо знаний в области CSS. Его цель научить читателя основам, достаточным для полноценного использования CSS. В данном учебнике вы узнаете что такое CSS, для чего и как эта технология используется, а также множество других тонкостей, использование которых на практике позволит делать красивые и практичные веб-сайты.