CSS справочник

CSS @правила (RULES)

Полный список свойств CSS

Правила CSS @ (At-rules)CSS z-index свойство

Полное руководство по свойствам CSS (по функциям)

CSS-свойства можно найти по алфавиту, данная часть содержит полные списки стандартных свойств, относящихся к последнему стандарту CSS3. Все свойства разделены на свойства анимации, свойства фона, свойства границ, цветовые свойства, размеры высоты и ширины, Flex-оболочки, свойства шрифтов, свойства элементов списка, свойства отступов, свойства контура, свойства текста и шрифтов, визуальные свойства и т.д.

Свойства анимации (Animation)

Свойство	Описание
`animation`	Указывает анимацию, основанную на ключевых кадрах.
`animation-delay`	Указывает время начала анимации.
`animation-direction`	Указывает, должна ли анимация играть в обратном порядке в альтернативных циклах.
`animation-duration`	Указывает количество секунд или миллисекунд, которые должна занять анимация для выполнения одного цикла.
`animation-fill-mode`	Указывает, как стили должны применяться к цели анимации до и после выполнения.
`animation-iteration-count`	Указывает количество раз, которое анимация должна повторяться до остановки.
`animation-name`	Указывает`@keyframes`Название применяемой к выбранному элементу определенной анимации.
`animation-play-state`	Указывает, должен ли запускаться или приостанавливаться анимация.
`animation-timing-function`	Указывает, как CSS-анимация должна выполняться в каждом цикле.

Свойства фона (Background)

Свойство	Описание
`background`	Определяет различные свойства фона в одном заявлении.
`background-attachment`	Указывает, является ли изображение фона фиксированным в окне просмотра или скользящим.
`background-clip`	Указывает область рисования фона.
`background-color`	Определяет цвет фона элемента.
`background-image`	Определяет местоположение изображения фона элемента.
`background-origin`	Указать область定位 фонового изображения.
`background-position`	Определить точку фона изображения.
`background-repeat`	Указать, следует ли ткать фоновое изображение или как это сделать.
`background-size`	Указать размер фонового изображения.

Свойства рамки (Border)

Свойство	Описание
`border`	Установить ширину, стиль и цвет всех четырех сторон рамки элемента.
`border-bottom`	Установить ширину, стиль и цвет нижнего края элемента.
`border-bottom-color`	Установить цвет нижнего края элемента.
`border-bottom-left-radius`	Определить форму левого нижнего края элемента.
`border-bottom-right-radius`	Определить форму правого нижнего края элемента.
`border-bottom-style`	Установить стиль нижнего края элемента.
`border-bottom-width`	Установить ширину нижнего края элемента.
`border-color`	Установить цвет рамки всех четырех сторон элемента.
`border-image`	Указать, как использовать изображение вместо стиля рамки.
`border-image-outset`	Указать количество, на которое рамка изображения выходит за пределы рамки.
`border-image-repeat`	Указать, следует ли повторять, закруглять или растягивать рамку изображения.
`border-image-slice`	Указать вектор вwards для рамки изображения.
`border-image-source`	Указать положение изображения, используемого в рамке.
`border-image-width`	Указать ширину рамки изображения.
`border-left`	Установить ширину, стиль и цвет левого края элемента.
`border-left-color`	Установить цвет левого края элемента.
`border-left-style`	Установить стиль левого края элемента.
`border-left-width`	Установить ширину левого края элемента.
`border-radius`	Определить форму углов границ элемента.
`border-right`	Установить ширину, стиль и цвет правого края элемента.
`border-right-color`	Установить цвет правого края элемента.
`border-right-style`	Установить стиль правого края элемента.
`border-right-width`	Установить ширину правого края элемента.
`border-style`	Установить стиль рамки на всех четырех сторонах элемента.
`border-top`	Установить ширину, стиль и цвет верхнего края элемента.
`border-top-color`	Устанавливает цвет верхнего края рамки элемента.
`border-top-left-radius`	Определяет форму верхнего левого угла элемента.
`border-top-right-radius`	Определяет форму верхнего правого угла элемента.
`border-top-style`	Устанавливает стиль верхнего края рамки элемента.
`border-top-width`	Устанавливает ширину верхнего края рамки элемента.
`border-width`	Устанавливает ширину рамки всех четырех сторон элемента.

Свойства цвета (Color)

Свойство	Описание
`color`	Определяет цвет текста элемента.
`opacity`	Определяет прозрачность элемента.

Свойства размеров (Size)

Свойство	Описание
`height`	Определяет высоту элемента.
`max-height`	Определяет максимальную высоту элемента.
`max-width`	Определяет максимальную ширину элемента.
`min-height`	Определяет минимальную высоту элемента.
`min-width`	Определяет минимальную ширину элемента.
`width`	Определяет ширину элемента.

Свойства содержимого (Content)

Свойство	Описание
`content`	Вставляет созданное содержимое.
`quotes`	Определяет символы для цитат в嵌入енных кавычках.
`counter-reset`	Создает или сбрасывает один или несколько счетчиков.
`counter-increment`	Увеличивает значение одного или нескольких счетчиков.

Эластичная компоновка Flex盒子 (Flex)

Свойство	Описание
`align-content`	Определяет способ выравнивания элементов в эластичном контейнере.
`align-items`	Определяет defaultManager для элементов в эластичном контейнере.
`align-self`	Определяет способ выравнивания выбранного элемента в эластичном контейнере.
`flex`	Определяет компонент эластичной длины.
`flex-basis`	Определяет начальный размер эластичного элемента по основной оси.
`flex-direction`	Определяет направление эластичных элементов.
`flex-flow`	`flex-direction`и`flex-wrap`Краткое свойство.
`flex-grow`	Определяет способ роста эластичных элементов по отношению к другим элементам в эластичном контейнере.
`flex-shrink`	Определяет способ сжатия эластичных элементов по отношению к другим элементам в эластичном контейнере.
`flex-wrap`	Определяет, должны ли柔性 предметы быть упакованы.
`justify-content`	Определяет, как эластичные элементы выравниваются по главному оси эластичного контейнера после решения всех эластичных длиин и автоматических отступов.
`order`	Определяет порядок отображения и компоновки эластичных элементов в эластичном контейнере.

Свойства шрифта (Fonts)

Свойство	Описание
`font`	Определяет различные свойства шрифта в одном заявлении.
`font-family`	Определяет список шрифтов элемента.
`font-size`	定义文本的字体大小。
`Определить размер шрифта текста.`	font-size-adjust
`Сохранить читаемость текста при возникновении замены шрифта.`	font-stretch
`Выбрать обычный, сжатый или расширенный шрифт из-font.`	font-style
`Определить стиль шрифта текста.`	font-variant
`Определить вариант шрифта.`	font-weight

Определить толщину шрифта текста.

Свойство	Описание
`Свойства списка (Lists)`	Определить стиль отображения списка и элементов списка.
`list-style-image`	Определить изображение, используемое в качестве маркера для элементов списка.
`list-style-position`	Определить положение маркера для элементов списка.
`list-style-type`	Определить стиль маркера для элементов списка.

Свойства отступа (Margin)

Свойство	Описание
`margin`	Установить отступы на всех четырех сторонах элемента.
`margin-bottom`	Установить нижний отступ элемента.
`margin-left`	Установить левый отступ элемента.
`margin-right`	Установить правый отступ элемента.
`margin-top`	Установить верхний отступ элемента.

Свойства многостолбичного макета (Column)

Свойство	Описание
`column-count`	Определить количество столбцов в многостолбичном элементе.
`column-fill`	Определить способ заполнения столбцов.
`column-gap`	Определить интервал между столбцами многостолбичного элемента.
`column-rule`	Определить прямую или "правило", рисуемую между каждым столбцом многостолбичного элемента.
`column-rule-color`	Определить цвет правил, рисуемых между столбцами в многостолбичном макете.
`column-rule-style`	Определить стиль правил, рисуемых между столбцами в многостолбичном макете.
`column-rule-width`	Определить ширину правил, рисуемых между столбцами в многостолбичном макете.
`column-span`	Определить, сколько столбцов элемент跨越 в многостолбичном макете.
`column-width`	Определить наилучшую ширину столбца в многостолбичном элементе.
`columns`	Используется для установки`column-width`и`column-count`Краткое свойство.

Свойства обводки (Outline)

Свойство	Описание
`outline`	Установить ширину, стиль и цвет всех четырех сторон обводки элемента.
`outline-color`	Установить цвет обводки.
`outline-offset`	Установить пространство между обводкой и границей элемента.
`outline-style`	Установить стиль обводки.
`outline-width`	Установить ширину обводки.

Свойство отступа (Padding)

Свойство	Описание
`padding`	Установить отступ снизу для элемента.
`padding-bottom`	Устанавливает заполнение в нижнюю сторону элемента.
`padding-left`	Устанавливает заполнение в левую сторону элемента.
`padding-right`	Устанавливает заполнение в правую сторону элемента.
`padding-top`	Устанавливает заполнение в верхнюю часть элемента.

Свойства печати (Print)

Свойство	Описание
`page-break-after`	Вставляет символ разрыва страницы после элемента.
`page-break-before`	Вставляет символ разрыва страницы перед элементом.
`page-break-inside`	Вставляет символ разрыва страницы в элемент.

Свойства таблицы (Table)

Свойство	Описание
`border-collapse`	Указывает, следует ли объединять или разделять границу ячеек таблицы.
`border-spacing`	Устанавливает интервал между границами смежных ячеек таблицы.
`caption-side`	Указывает положение заголовка таблицы.
`empty-cells`	Показывает или скрывает рамки и фоновые цвета пустых ячеек таблицы.
`table-layout`	Указывает алгоритм разложения таблицы.

Свойства текста (Text)

Свойство	Описание
`direction`	Определяет направление текста/направление письма.
`tab-size`	Указывает длину табулятора.
`text-align`	Устанавливает горизонтальное выравнивание инлайн-содержимого.
`text-align-last`	Указывает, когда`text-align`Как выравнивать последнюю строку блока или строку перед强制ным переносом строки, когда свойство установлено в значение`justify`.
`text-decoration`	Указывает, какие элементы декорации добавить к тексту.
`text-decoration-color`	Указывает指定的 цвет`text-decoration-line`.
`text-decoration-line`	Указывает,哪种 линии декорации добавить к элементу.
`text-decoration-style`	Указывает`text-decoration-line`Свойство указывает на стиль линий.
`text-indent`	Выводит отступ первого строки текста.
`text-justify`	Указывает, когда`text-align`Когда свойство установлено в значение, используется метод выравнивания.`justify`.
`text-overflow`	Указывает, как отображать текст, когда он выходит за пределы блока.
`text-shadow`	Прилагает один или несколько тени к текстовому содержимому элемента.
`text-transform`	Преобразует текст к верхнему или нижнему регистру.
`line-height`	Устанавливает высоту между строками текста.
`vertical-align`	Устанавливает вертикальное положение элемента относительно текущей текстовой базовой линии.
`letter-spacing`	Устанавливает дополнительное расстояние между буквами.
`word-spacing`	Устанавливает интервал между словами.
`white-space`	Указывает, как обрабатывать пробельные символы в элементе.
`word-break`	Указывает, как выполнять перенос слов.
`word-wrap`	Указать, следует ли прерывать слово, когда оно выходит за пределы границ контейнера содержимого.

Свойства преобразования (Transform)

Свойство	Описание
`backface-visibility`	Указать, виден ли «бок» преобразованного элемента, когда он направлен к пользователю.
`perspective`	Определить перспективу для всех подэлементов, видимых из объекта.
`perspective-origin`	Определить точку origins для свойств перспективы (точка исчезновения в 3D пространстве).
`transform`	Применить 2D или 3D преобразование к элементу.
`transform-origin`	Определить точку преобразования элемента.
`transform-style`	Указать, как渲染 вложенные элементы в 3D пространстве.

Переходные свойства (Transition)

Свойство	Описание
`transition`	Определить транзит между двумя состояниями элемента.
`transition-delay`	Указать, когда начинается эффект транзита.
`transition-duration`	Указать количество секунд или миллисекунд, которые займет эффект транзита.
`transition-property`	Указать имя CSS свойства, к которому должен применяться эффект транзита.
`transition-timing-function`	Указать кривую скорости эффекта транзита.

Визуальные форматные свойства

Свойство	Описание
`display`	Указать способ отображения элемента на экране.
`position`	Указать, как расположить элемент.
`top`	Указать положение верхнего края расположенного элемента.
`right`	Указать положение правого края расположенного элемента.
`bottom`	Указать положение нижнего края расположенного элемента.
`left`	Указать положение левого края расположенного элемента.
`float`	Указать, должен ли блок浮动.
`clear`	Указать положение элемента относительно плавающего элемента.
`z-index`	Указать иерархию или порядок堆积 расположенных элементов.
`overflow`	Указать, как обрабатывать содержимое, которое выходит за рамки рамки элемента.
`overflow-x`	Указать, как управлять содержимым, когда оно выходит за границу ширины области содержимого элемента.
`overflow-y`	Указать, как управлять содержимым, когда оно выходит за границу высоты области содержимого элемента.
`resize`	Указать, можно ли пользователю изменять размер элемента.
`clip`	Определить область обрезки.
`visibility`	Указать, виден ли элемент.
`cursor`	Указать тип курсора.
`box-shadow`	Применить один или несколько тени к рамке элемента.
`box-sizing`	Изменить défaut CSS box model.

Правила CSS @ (At-rules)CSS z-index свойство