Технология CSS (Каскадные листы стилей)

Каскадные листы стилей (далее просто - стили ) разработаны для облегчения работы Web-мастеров. Например, создавая сайт из множества страниц Вы хотите чтобы форматирование элементов страницы проходило по определенному шаблону, что не заставляла бы лишний раз вводить в код каждой страницы длинные значения атрибутов. Таким шаблоном и являются стили. Общий принцип написания их сводится к следующей последовательности:

свойства_стиля1: значение; свойство_стиля2: значение;.......свойство_стиляN: значение ,

где остальные знаки пунктуации применяются в зависимости от свойств стиля.

По своим свойствам стили делятся на три группы.

  1. Находят применение, когда нужно отформатировать элемент не повторяющий больше нигде на странице и имеющий отношение к конкретному тэгу. Описывается данный стиль так: <ТЕГ атрибут1="значение"...... атрибутN="значение" STYLE="свойство_стиля1: значение ... свойство_стиляN: значение" >
  2. Применяются для описания способов форматирования элементов страниц глобально с присвоением имени для каждого стиля. Данное описание помещается непосредственно в код страницы - в контейнер <HEAD>с помощью контейнера <STYLE> . Приводим пример: <HEAD> <STYLE type=text/css > .имя_стиля {описание_стиля} TD.имя_стиля {описание_стиля} </STYLE> </HEAD> , где "type=text/css" - обязательная информация, а TD - обозначение тэга к которому будет применяться стиль. Под словами "описание_стиля" следует понимать различные параметры форматирования элемента, которых может быть много.
  3. Используются при применении стилей в больших количествах или когда имеется более десяти страниц, представляя из себя отдельный текстовой файл с расширение .css . Ссылка на такой файл указывается в контейнере <HEAD> и имеет следующий вид: <LINK HREF=" адрес_файла стилей/имя_файла .css" TYPE="text/css" REL ="stylesheet">, где TYPEиREL -атрибуты, определяющие тип файла. Кстати сослаться можно и по другому: @import url ("адрес_файла стилей/имя_файла .css").

После того, как укажем стили в самой страничке или сделаем ссылку на них - можно применять их при непосредственном участии атрибутов <CLASS>или <ID> на нужных тэгах. Пример:

< TD CLASS=" имя_стиля "> элемент_страницы </TD> .

Существует также ещё два способа применения стилей - описание псевдоклассов и псевдоэлементов.

Единицы измерения в CSS обозначаются в:

  • пикселях (px) - минимальная точка на экране
  • пунктах (pt) - единица измерения шрифта (1пункт=1/72 дюйма
  • пиках (pc) - 1 пика равна 12пунктам
  • процентах (%) - отношение к другой величине
  • миллиметрах (mm) и сантиметрах (cm) - без комментариев
  • дюймах (in) - 1 дюйм равен 2,52 cm

В стилях, как и во всём языке HTML, при описании цвета применяется модель RGB .

В спецификации HTML 4.01 данного языка каскадные листы стилей нужно использовать повсеместно , где они могут иметь применение. Международный консорциум W3C, утвердивший эту спецификацию, рекомендует использовать CSS (Cascading Style Sheets). Другие методы отмечены в ней как нежелательные.

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

Среди широкого выбора HTML-редакторов в которых есть возможность создания каскадных листов стилей стоит выделить на наш взгляд простые и понятные - Macromedia HomeSite 5.0 с его Top Style и Macromedia Dreamweaver MX 2004. Последний будет получше для новичков.

Прежде чем переходить к редакторам настоятельно рекомендуем пройти теоретические занятия по тем ссылкам .


Created/Updated: 25.05.2018

stop war in Ukraine

ukrTrident

stand with Ukraine