CSS

CSS

CSS — (акроним c англ. Cascading Style Sheets — Каскадные Таблицы Стилей) — набор параметров форматирования, применяемый к элементам документа, для изменения отображения внешнего вида документа.

До появления CSS, в HTML-код прописывали всю информацию о странице: цвет, шрифт и параметры оформления. И для изменения, например, размера шрифта, приходилось редактировать все странички сайта. В 1994 году Хокон Виум Ли ввел термин и концепцию «Каскадные Таблицы Стилей» и вместе с Бертом Боссом начал развивать CSS.

CSS

Что может CSS?

CSS работает с цветом, шрифтами, строками, размерами, позиционированием элементов, фоном и многими другими вещами. От версии к версии CSS обрастает новыми возможностями.

Возможности первой версии CSS:

  • Работа со шрифтом — размер, гарнитура и стиль (обычный полужирный и курсивный)
  • Атрибуты текста — межстрочные отступы, межсимвольный интервал и расстояние между словами
  • Работа с цветом — цвет фона, текста, рамок и т. д.
  • Выравнивание элементов — таблиц, изображений, текста и т. д.
  • Свойства блоков — внутренние и внешние отступы, рамки, float. clear

Добавленный функционал в версии CSS 2:

  • Типы носителей — монитор, телевизор, планшет смартфон, кпк, печать
  • Страничные носители — разные стили для элементов четных и нечетных страниц при печати
  • Звуковые таблицы стилей — позволяют настраивать синтезируемую речь для слабовидящих посетителей сайта.
  • Расширенный механизм селекторов
  • Блочная вёрстка.
  • Относительное, абсолютное и фиксированное позиционирование — позволяют управлять расположением элементов на странице без использования табличной вёрстки.
  • Генерируемое содержимое — при необходимости позволяет добавлять содержимое, которого нет в исходном документе, до или после нужного элемента.
  • Указатели

На данный момент вышла и рекомендуется к использованию версия CSS 3. Изменения:

  • Кроме HTML и XHTML применяется также к любым XML документам
  • Возможность создания анимации без использования языка программирования JavaScript
  • Поддержка сглаживания, теней и градиентов
Логотип CSS 3

Какие преимущества имеет CSS перед HTML?

HTML используется для создания структуры содержимого страницы, а CSS позволяет вам создавать шаблоны оформления и, при необходимости, быстро их редактировать.

Плюсы CSS:

  • Массовое изменение внешнего вида множества документов
  • Полный контроль над внешним видом страницы
  • Свое отображение под каждый экран и печать
  • Возможность реализовать сложные дизайны

Применение CSS на практике

Для использования языка стилей на вашем проекте, необходимо:

  • Создать файл с разрешением.css, например design.css
body {
background-color: #FFCC66;
}

h1 {
color: #990000;
background-color: #FC9804;
}
p{
color:#000FD5;	
border:1px solid #f038fd;
}
  • Прописать в этом файле свойства для всех элементов соответственно дизайну.
  • Разместить файл на сервере где находится ваш проект
  • Подключить файл стилей для каждой страницы (обычно подключается в шапке между тегами <head>…</head> сразу для всех страниц)
<link href="/style/design.css" rel="stylesheet" type="text/css" />

Уроки по теме: