www html, html уроки, html теги, css, верстка
статьи html уроки книги по css и html урокам вопросы и ответы Помощь сайту
Главная страница > Свойства CSS (ЦСС)
Свойства CSS (ЦСС)
Все свойства
!important
@import
@media
active
after
background
background-attachment
background-color
background-image
background-position
background-repeat
before
border
border-bottom
border-bottom-color
border-bottom-style
border-bottom-width
border-collapse
border-color
border-left
border-left-color
border-left-style
border-left-width
border-right
border-right-color
border-right-style
border-right-width
border-spacing
border-style
border-top
border-top-color
border-top-style
border-top-width
border-width
bottom
caption-side
clear
clip
color
content
counter-increment
counter-reset
cursor
direction
display
empty-cells
first-child
first-letter
float
focus
font
font-family
font-size
font-style
font-variant
font-weight
height
hover
left
letter-spacing
line-height
link
list-style
list-style-image
list-style-position
list-style-type
margin
margin-bottom
margin-left
margin-right
margin-top
max-height
max-width
min-height
min-width
opacity
outline
outline-color
outline-style
outline-width
overflow
padding
padding-bottom
padding-left
padding-right
padding-top
position
quotes
right
table-layout
text-align
text-decoration
text-indent
text-transform
top
unicode-bidi
vertical-align
visibility
visited
white-space
width
word-spacing
z-index
CSS (ЦСС) по категориям
Цвет и фон
Границы
Шрифт
контент
Списки
Форматирование
Позиционирование
Отступы
Поля
Таблицы
Интерфейс
Важность
Псевдоэлементы
Псевдоклассы
Контент

Свойства CSS (ЦСС)

Цвет и фон

background

Параметр позволяет установить одновременно до пяти атрибутов стиля фона. Значения могут идти в любом порядке, браузер сам определит, какое из них соответствует нужному атрибуту.

background-attachment

Параметр background-attachment устанавливает, будет ли прокручиваться фоновое изображение вместе с содержимым элемента. Изображение может быть зафиксировано и оставаться неподвижным, либо перемещаться совместно с файлом.

background-color

Устанавливает фоновый цвет элемента.

background-image

Устанавливает фоновое изображение для элемента. Если одновременно для элемента задан цвет фона, он будет показан, пока фоновая картинка не загрузится полностью.

background-position

Задает начальное положение фонового Имаги, установленного с помощью параметра background-image.

background-repeat

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

color

Определяет цвет контента элемента.

opacity

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

Границы

border

Параметр позволяет одновременно установить толщину, стиль и цвет рамки вокруг элемента. Значения могут идти в любом порядке, разделяясь пробелом, браузер сам определит, какое из них соответствует нужному атрибуту.

border-bottom

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

border-bottom-color

Устанавливает цвет границы внизу элемента.

border-bottom-style

Устанавливает стиль границы внизу элемента.

border-bottom-width

Задает толщину границы внизу элемента.

border-color

Устанавливает цвет границы на разных сторонах элемента. Параметр позволяет задать цвет границы сразу на всех сторонах элемента или определить цвет границы только на указанных сторонах.

border-left

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

border-left-color

Задает цвет границы слева от элемента.

border-left-style

Устанавливает стиль границы слева от элемента.

border-left-width

Задает толщину границы слева от элемента.

border-right

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

border-right-color

Задает цвет границы справа от элемента. Значение цвета может задаваться по его названию, шестнадцатеричному значению, либо с помощью RGB.

border-right-style

Устанавливает стиль границы справа от элемента.

border-right-width

Устанавливает толщину границы справа от элемента.

border-style

Устанавливает стиль рамки вокруг элемента. Допустимо задавать индивидуальные стили для разных сторон элемента.

border-top

Одновременно задает толщину, стиль и цвет границы сверху элемента.

border-top-color

Задает цвет границы сверху элемента.

border-top-style

Устанавливает стиль границы сверху элемента.

border-top-width

Устанавливает толщину границы сверху элемента.

border-width

Задает толщину границы одновременно на всех сторонах элемента или индивидуально для каждой стороны. Способ изменения толщины зависит от числа аргументов.

outline

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

outline-color

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

outline-style

Задает стиль внешней границы элемента.

outline-width

Задает толщину внешней границы элемента.

Шрифт

font

Универсальный параметр, который позволяет установить одновременно несколько атрибутов стиля шрифта.

font-family

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

font-size

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

font-style

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

font-variant

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

font-weight

Устанавливает насыщенность шрифта. Значение устанавливается от 100 до 900 с шагом 100. Также допустимо использование ключевых слов.

контент

direction

Атрибуты unicode-bidi и direction задают, как должен располагаться контент используемого языка — слева направо или справо налево.

letter-spacing

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

line-height

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

text-align

Определяет горизонтальное выравнивание контента в пределах элемента.

text-decoration

Добавляет оформление контента в виде его подчеркивания, перечеркивания, линии над контентом и мигания. Одновременно можно применить более одного стиля, перечисляя значения через пробел.

text-indent

Устанавливает величину отступа первой строки блока контента (например, для параграфа P). Воздействия на все остальные строки не оказывается.

text-transform

Управляет преобразованием контента элемента в заглавные или прописные символы. Когда значение отлично от none, регистр исходного контента будет изменен.

unicode-bidi

Атрибуты unicode-bidi и direction задают, как должен располагаться контент используемого языка — слева направо или справо налево.

vertical-align

Выравнивает элемент по вертикали относительно своего родителя или окружающего контента.

white-space

Параметр white-space устанавливает, как отображать пробелы между словами.

word-spacing

Устанавливает интервал между словами. Если установлен параметр выравнивания justify, то атрибут word-spacing не действует, поскольку интервал между словами будет установлен принудительно.

Списки

list-style

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

list-style-image

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

list-style-position

Определяет, как будет размещаться маркер относительно контента. Имеется два значения: outside — маркер вынесен за границу элемента списка и inside — маркер обтекается контентом.

list-style-type

Изменяет вид маркера для каждого элемента списка. Этот атрибут используется только в случае, когда значение свойства list-style-image установлено как none. Маркеры различаются для маркированного списка (тег UL) и нумерованного (тег OL).

Форматирование

clear

Параметр устанавливает, с какой стороны элемента запрещено его обтекание другими элементами. Если установлено обтекание элемента с помощью параметра float, свойство clear отменяет его действие для указанных сторон.

clip

Параметр clip определяет область позиционированного элемента, в которой будет показано его содержимое. Все, что не помещается в эту область, будет обрезано и становится невидимым. На данный момент единственно доступная форма области — прямоугольник.

display

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

float

Определяет, по какой стороне будет выравниваться элемент, при этом остальные элементы будут обтекать его с других сторон.

height

Устанавливает высоту блочных или заменяемых элементов (к ним, например, относится тег IMG. Высота не включает толщину границ вокруг элемента, значение отступов и полей.

max-height

Устанавливает максимальную высоту элемента. Значение высоты элемента будет вычисляться в зависимости от установленных параметров height, max-height и min-height.

max-width

Устанавливает максимальную ширину элемента.

min-height

Задает минимальную высоту элемента. Значение высоты элемента будет вычисляться в зависимости от установленных параметров height, max-height и min-height.

min-width

Задает минимальную ширину элемента. Если окно браузера достигает заданной минимальной ширины элемента, то его ширина остается нетронутой и появляется горизонтальная полоска прокрутки.

overflow

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

visibility

Предназначен для отображения или скрытия элемента, включая рамку вокруг него и фон. При скрытии элемента, хотя он и становится не виден, место, которое элемент занимает, остается за ним.

width

Устанавливает ширину блочных или заменяемых элементов. Ширина не включает толщину границ вокруг элемента, значение отступов и полей.

Позиционирование

bottom

Устанавливает положение нижнего края содержимого элемента без учета толщины рамок и отступов. Отсчет координат зависит от параметра position, он обычно принимает значение relative (относительное положение) или absolute (абсолютное положение).

left

Для позиционированного элемента определяет расстояние от левого края родительского элемента, не включая отступ, поле и ширину рамки, до левого края дочернего элемента. Отсчет координат зависит от значения параметра position.

position

Устанавливает способ позиционирования элемента относительно окна браузера или других объектов на web-странице.

right

Для позиционированного элемента определяет расстояние от правого края родительского элемента, не включая отступ, поле и ширину рамки, до правого края дочернего элемента.

top

Для позиционированного элемента определяет расстояние от верхнего края родительского элемента, не включая отступ, поле и ширину рамки, до верхнего края дочернего элемента.

z-index

Управляет размещением элементов по z-оси, что позволяет накладывать элементы друг на друга.

Отступы

margin

Устанавливает величину отступа от каждого края элемента. Отступом является пространство от границы текущего элемента до внутренней границы его родительского элемента.

margin-bottom

Устанавливает величину отступа от нижнего края элемента.

margin-left

Устанавливает величину отступа от левого края элемента.

margin-right

Задает величину отступа от правого края элемента.

margin-top

Устанавливает величину отступа от верхнего края элемента.

Поля

padding

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

padding-bottom

Устанавливает значение поля от нижнего края содержимого элемента.

padding-left

Устанавливает значение поля от левого края содержимого элемента.

padding-right

Задает значение поля от правого края содержимого элемента.

padding-top

Задает величину поля от верхнего края содержимого элемента.

Таблицы

border-collapse

Устанавливает, как отображать границы вокруг ячеек таблицы. Этот параметр играет роль, когда для ячеек установлена рамка, тогда в месте стыка ячеек получится линия двойной толщины. Добавление значения collapse заставляет браузер анализировать подобные места в таблице и убирать в ней двойные линии.

border-spacing

Задает расстояние между границами ячеек в таблице. Атрибут border-spacing не работает в случае, когда для таблицы установлен параметр border-collapse со значением collapse.

caption-side

Определяет положение заголовка таблицы, который задается с помощью тега CAPTION, относительно самой таблицы. Параметр caption-side выводит заголовок до или после таблицы, а выравнивание контента по правому или левому краю устанавливается через атрибут text-align.

empty-cells

Параметр задает отображение границ и фона в ячейке, если в ней нет видимого содержания. При одновременном добавлении к таблице параметра border-collapse со значением collapse, атрибут empty-cells игнорируется.

table-layout

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

Интерфейс

cursor

Устанавливает форму курсора, когда он находится в пределах элемента. Вид курсора зависит от операционной системы и установленных параметров.

Важность

!important

Играет роль в том случае, когда пользователи подключают свою собственную таблицу стилей. Если возникает противоречие, когда стиль автора страницы и пользователя для одного и того же элемента не совпадает, то !important позволяет повысить приоритет стилевого параметра.

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

after

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

before

Псевдоэлемент before применяется для отображения желаемого контента до элемента, к которому он добавляется. before работает совместно с тегом content.

first-letter

Псевдоэлемент first-letter определяет стиль первого символа в контенте элемента, к которому добавляется. К этому псевдоэлементу могут применяться только стилевые атрибуты, связанные со свойствами шрифта, полями, отступами, границами, цветом и фоном.

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

active

Псевдокласс active определяет стиль для активной ссылки. Активной ссылка становится при нажатии на нее.

first-child

Псевдокласс first-child добавляет стилевое оформление к первому дочернему элементу селектора, который расположен в дереве элементов объекта.

focus

Псевдокласс focus определяет стиль для элемента получающего фокус. Например, им может быть контентовое поле формы, в которое устанавливается курсор.

hover

Определяет стиль элемента при наведении на него курсора мыши.

link

Псевдокласс link применяется к ссылкам, которые еще не посещались пользователем, и задает для них стилевое оформление.

visited

Псевдокласс visited применяется к ссылкам, уже посещенные пользователем, и задает для них стилевое оформление.

Контент

content

Атрибут content позволяет вставлять генерируемое содержание в контент web-страницы, которое первоначально в контенте отсутствует.

counter-increment

Предназначен для увеличения значения счетчика приращений, который задается параметром counter-reset. Такой счетчик подсчитывает количество отображений элементов на странице и может выводиться с помощью свойства content и псевдоэлементов after и before. Это позволяет создавать списки (в том числе многоуровневые), в которых нумерация и вид задаются через стили.

counter-reset

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

quotes

Устанавливает вид кавычек, который применяется в контенте объекта.

Copyright 2009 Все права защищены

О нашем Internet проекте | Наши планы | Контент нашего сайта | Есть ошибки... | Технологии | Поддержать проект