CSS Довідник

A

accent-color	Визначає колір акценту для елементів керування інтерфейсу користувача
align-content	Визначає вирівнювання між лініями всередині гнучкого контейнера, коли елементи не використовують увесь доступний простір
align-items	Визначає вирівнювання для елементів усередині гнучкого контейнера
align-self	Визначає вирівнювання для вибраних елементів усередині гнучкого контейнера
all	Скидає всі властивості (крім unicode-bidi та напрямку)
animation	Скорочена властивість для всіх властивостей animation-*
animation-delay	Визначає затримку для початку анімації
animation-direction	Визначає, чи має відтворюватися анімація вперед, назад або по черзі
animation-duration	Визначає, скільки часу має тривати анімація, щоб завершити один цикл
animation-fill-mode	Визначає стиль для елемента, коли анімація не відтворюється (перед її початком, після її завершення або обидва)
animation-iteration-count	Визначає кількість відтворення анімації
animation-name	Вказує назву для анімації @keyframes
animation-play-state	Визначає, чи анімація запущена чи призупинена
animation-timing-function	Визначає криву швидкості анімації

B

backdrop-filter	Визначає графічний ефект для області за елементом
backface-visibility	Визначає, чи повинна бути видима задня сторона елемента, коли він дивиться на користувача
background	Скорочена властивість для всіх властивостей background-*
background-attachment	Встановлює, чи фонове зображення прокручується разом із рештою сторінки, чи є фіксованим
background-blend-mode	Визначає режим змішування кожного фонового шару (колір/зображення)
background-clip	Визначає, наскільки фон (колір або зображення) має простягатися в межах елемента
background-color	Визначає колір фону елемента
background-image	Визначає одне або кілька фонових зображень для елемента
background-origin	Визначає початкове положення фонового зображення
background-position	Визначає положення фонового зображення
background-repeat	Встановлює, чи/як буде повторюватися фонове зображення
background-size	Визначає розмір фонових зображень
border	Скорочена властивість для border-width, border-style та border-color
border-bottom	Скорочена властивість для border-bottom-width, border-bottom-style та border-bottom-color
border-bottom-color	Визначає колір нижньої межі
border-bottom-left-radius	Визначає радіус межі нижнього лівого кута
border-bottom-right-radius	Визначає радіус межі нижнього правого кута
border-bottom-style	Встановлює стиль нижньої межі
border-bottom-width	Встановлює ширину нижньої межі
border-collapse	Встановлює, чи повинні межі таблиці згортатися в одну межу чи бути розділеними
border-color	Встановлює колір чотирьох меж
border-image	Скорочена властивість для всіх властивостей border-image-*
border-image-outset	Визначає величину, на яку межа зображення виходить за межу
border-image-repeat	Визначає, чи має зображення рамки повторюватися, округлятися чи розтягуватися
border-image-slice	Визначає, як розрізати межу зображення
border-image-source	Вказує шлях до зображення, яке буде використано як межу
border-image-width	Визначає ширину межі зображення
border-left	Скорочена властивість для всіх властивостей border-left-*
border-left-color	Встановлює колір лівої межі
border-left-style	Встановлює стиль лівої межі
border-left-width	Встановлює ширину лівої межі
border-radius	Скорочена властивість для чотирьох властивостей border-*-radius
border-right	Скорочена властивість для всіх властивостей border-right-*
border-right-color	Встановлює колір правої межі
border-right-style	Встановлює стиль правої межі
border-right-width	Встановлює ширину правої межі
border-spacing	Встановлює відстань між межами суміжних комірок
border-style	Встановлює стиль чотирьох меж
border-top	Скорочена властивість для border-top-width, border-top-style та border-top-color
border-top-color	Встановлює колір верхньої межі
border-top-left-radius	Визначає радіус межі верхнього лівого кута
border-top-right-radius	Визначає радіус межі верхнього правого кута
border-top-style	Встановлює стиль верхньої межі
border-top-width	Встановлює ширину верхньої межі
border-width	Встановлює ширину чотирьох меж
bottom	Встановлює позицію елементів від нижньої частини батьківського елемента
box-decoration-break	Встановлює поведінку фону та межі елемента під час розриву сторінки або для вбудованих елементів, під час розриву рядка.
box-shadow	Додає одну або кілька тіней до елемента
box-sizing	Визначає, як обчислюються ширина та висота елемента: мають вони включати відступи та межі чи ні
break-after	Визначає, чи має відбуватися розрив сторінки, стовпця чи області після зазначеного елемента
break-before	Визначає, чи має відбуватися розрив сторінки, стовпця чи області перед вказаним елементом
break-inside	Визначає, чи має відбуватися розрив сторінки, стовпця чи області всередині вказаного елемента

C

caption-side	Визначає розміщення підпису до таблиці
caret-color	Визначає колір курсора (каретки) у вхідних даних, текстових областях або будь-якому елементі, який можна редагувати
@charset	Визначає кодування символів, що використовується в таблиці стилів
clear	Визначає, що має статися з елементом, який знаходиться поруч із плаваючим елементом
clip	Затискає абсолютно позиціонований елемент
color	Встановлює колір тексту
column-count	Визначає кількість стовпців, на які має бути розділений елемент
column-fill	Визначає, як заповнювати стовпці, збалансовано чи ні
column-gap	Визначає проміжок між колонками
column-rule	Скорочена властивість для всіх властивостей column-rule-*
column-rule-color	Визначає колір лінії між стовпцями
column-rule-style	Визначає стиль правила між стовпцями
column-rule-width	Визначає ширину лінії між стовпцями
column-span	Визначає, скільки стовпців має охоплювати елемент
column-width	Визначає ширину стовпця
columns	Скорочена властивість для column-width та column-count
content	Використовується з псевдоелементами :before та :after для вставки створеного вмісту
counter-increment	Збільшує або зменшує значення одного чи кількох лічильників CSS
counter-reset	Створює або скидає один або кілька лічильників CSS
cursor	Визначає курсор миші, який буде відображатися при наведенні на елемент

D

direction	Визначає напрямок тексту/напрямок написання
display	Визначає, як має відображатися певний елемент HTML

E

empty-cells

Визначає, чи відображати межі та фон порожніх клітинок у таблиці

F

filter	Визначає ефекти (наприклад, розмивання або зміну кольору) для елемента перед його відображенням
flex	Скорочена властивість для властивостей flex-grow, flex-shrink та flex-basis
flex-basis	Визначає початкову довжину гнучкого елемента
flex-direction	Визначає напрямок гнучких елементів
flex-flow	Скорочена властивість для властивостей flex-direction та flex-wrap
flex-grow	Визначає, наскільки об’єкт буде рости відносно решти
flex-shrink	Визначає, як елемент буде зменшуватися відносно решти
flex-wrap	Визначає, чи повинні гнучкі елементи обертатися чи ні
float	Визначає, чи повинен елемент плавати ліворуч, праворуч або взагалі не повинен плавати
font	Скорочена властивість для властивостей font-style, font-variant, font-weight, font-size/line-height та font-family
@font-face	Правило, яке дозволяє вебсайтам завантажувати та використовувати шрифти, відмінні від "веб-безпечних" шрифтів
font-family	Визначає сімейство шрифтів для тексту
font-feature-settings	Дозволяє контролювати розширені типографічні функції у шрифтах OpenType
@font-feature-values	Дозволяє авторам використовувати загальну назву в font-variant-alternate для функції, активованої по-різному в OpenType
font-kerning	Керує використанням інформації про кернінг (проміжки між літерами)
font-language-override	Керує використанням мовних гліфів у гарнітурі
font-size	Визначає розмір шрифту тексту
font-size-adjust	Зберігає читабельність тексту, коли виникає резервний шрифт
font-stretch	Вибирає звичайне, стиснуте або розширений вигляд з сімейства шрифтів
font-style	Визначає стиль шрифту для тексту
font-synthesis	Контролює, які відсутні шрифти (жирний або курсив) можуть бути синтезовані браузером
font-variant	Визначає, чи слід відображати текст малим шрифтом
font-variant-alternates	Керує використанням альтернативних гліфів, пов’язаних з альтернативними назвами, визначеними в @font-feature-values
font-variant-caps	Керує використанням альтернативних гліфів для великих літер
font-variant-east-asian	Контролює використання альтернативних гліфів для східноазіатських писемностей (наприклад, японської та китайської)
font-variant-ligatures	Контролює, які лігатури та контекстуальні форми використовуються в текстовому вмісті елементів, до яких він застосовується
font-variant-numeric	Керує використанням альтернативних гліфів для чисел, дробів і порядкових маркерів
font-variant-position	Керує використанням альтернативних гліфів меншого розміру, розташованих як верхній або нижній індекс відносно базової лінії шрифту
font-weight	Визначає товщину шрифту

G

gap	Скорочена властивість для властивостей row-gap та column-gap
grid	Скорочена властивість для властивостей grid-template-rows, grid-template-columns, grid-template-areas, grid-auto-rows, grid-auto-columns та grid-auto-flow
grid-area	Або вказує назву для елемента сітки, або ця властивість є скороченою властивістю для grid-row-start, grid-column-start, grid-row-end і grid-column-end
grid-auto-columns	Визначає розмір стовпця за умовчанням
grid-auto-flow	Визначає, як автоматично розміщені елементи вставляють у сітку
grid-auto-rows	Визначає розмір рядка за умовчанням
grid-column	Скорочена властивість для властивостей grid-column-start та grid-column-end
grid-column-end	Визначає, де закінчувати елемент сітки
grid-column-gap	Визначає розмір проміжку між колонками
grid-column-start	Визначає, з чого почати елемент сітки
grid-gap	Скорочена властивість для grid-row-gap and grid-column-gap properties
grid-row	Скорочена властивість для властивостей grid-row-start та grid-row-end
grid-row-end	Визначає, де закінчувати елемент сітки
grid-row-gap	Визначає розмір проміжку між рядами
grid-row-start	Визначає, з чого почати елемент сітки
grid-template	Скорочена властивість для властивостей grid-template-rows, grid-template-columns та grid-areas
grid-template-areas	Визначає спосіб відображення стовпців і рядків за допомогою іменованих елементів сітки
grid-template-columns	Визначає розмір стовпців і кількість стовпців у макеті сітки
grid-template-rows	Визначає розмір рядків у макеті сітки

H

hanging-punctuation	Визначає, чи можна поставити знак пунктуації за межами рядка
height	Встановлює висоту елемента
hyphens	Встановлює спосіб розділення слів для покращення макета параграфів

I

image-rendering	Визначає тип алгоритму для масштабування зображення
@import	Дозволяє імпортувати таблицю стилів в іншу таблицю стилів
isolation	Визначає, чи повинен елемент створювати новий вміст стеку

J

justify-content

Визначає вирівнювання між елементами всередині гнучкого контейнера, коли елементи не використовують увесь доступний простір

K

@keyframes

Визначає код анімації

L

left	Визначає ліву позицію позиціонованого елемента
letter-spacing	Збільшує або зменшує пробіл між символами в тексті
line-break	Визначає, як/якщо розривати рядки
line-height	Встановлює висоту лінії
list-style	Встановлює всі властивості для списку в одній декларації
list-style-image	Визначає зображення як маркер елемента списку
list-style-position	Визначає положення маркерів елементів списку (маркованих точок)
list-style-type	Визначає тип маркера пункту списку

M

margin	Встановлює всі властивості поля в одній декларації
margin-bottom	Встановлює нижнє поле елемента
margin-left	Встановлює ліве поле елемента
margin-right	Встановлює праве поле елемента
margin-top	Встановлює верхнє поле елемента
mask	Приховує частини елемента шляхом маскування або вирізання зображення в певних місцях
mask-clip	Визначає область маски
mask-composite	Представляє операцію компонування, що використовується на поточному шарі маски з шарами маски під ним
mask-image	Визначає зображення, яке буде використовуватися як шар маски для елемента
mask-mode	Визначає, чи розглядається зображення шару маски як маска яскравості чи як маска альфа
mask-origin	Визначає початкове положення (область положення маски) зображення шару маски
mask-position	Встановлює початкове положення зображення шару маски (відносно області положення маски)
mask-repeat	Визначає спосіб повторення зображення шару маски
mask-size	Визначає розмір зображення шару маски
mask-type	Визначає, чи SVG елемент <mask> розглядається як маска яскравості або як маска альфа
max-height	Встановлює максимальну висоту елемента
max-width	Встановлює максимальну висоту елемента
@media	Встановлює правила стилю для різних типів/пристроїв/розмірів носіїв
min-height	Встановлює мінімальну висоту елемента
min-width	Встановлює мінімальну ширину елемента
mix-blend-mode	Визначає, як вміст елемента має поєднуватися з його безпосереднім батьківським фоном

O

object-fit	Визначає, як вміст заміненого елемента має бути розміщено в блоці, що встановлений його використаною висотою та шириною
object-position	Визначає вирівнювання заміненого елемента всередині його поля
opacity	Встановлює рівень непрозорості для елемента
order	Встановлює порядок гнучкого елемента відносно решти
orphans	Встановлює мінімальну кількість рядків, які потрібно залишити внизу сторінки або стовпця
outline	Скорочена властивість для властивостей outline-width, outline-style та outline-color
outline-color	Встановлює колір контуру
outline-offset	Зміщує контур і малює його за край межі
outline-style	Встановлює стиль контуру
outline-width	Встановлює ширину контуру
overflow	Визначає, що станеться, якщо вміст переповнить поле елемента
overflow-wrap	Визначає, чи може браузер розривати рядки з довгими словами, якщо вони переповнюють контейнер
overflow-x	Визначає, чи обрізати лівий/правий краї вмісту, якщо він переповнює область вмісту елемента
overflow-y	Визначає, чи обрізати верхній/нижній краї вмісту, якщо він переповнює область вмісту елемента

P

padding	Скорочена властивість для всіх властивостей padding-*
padding-bottom	Встановлює нижній відступ елемента
padding-left	Встановлює лівий відступ елемента
padding-right	Встановлює правильний відступ елемента
padding-top	Встановлює верхній відступ елемента
page-break-after	Встановлює поведінку розриву сторінки після елемента
page-break-before	Встановлює поведінку розриву сторінки перед елементом
page-break-inside	Встановлює поведінку розриву сторінки всередині елемента
perspective	Надає тривимірному елементу деяку перспективу
perspective-origin	Визначає, з якої позиції користувач дивиться на 3D-розташований елемент
pointer-events	Визначає, чи реагує елемент на події покажчика
position	Визначає тип методу позиціонування, що використовується для елемента (статичний, відносний, абсолютний або фіксований)

Q

quotes

Встановлює тип лапок для вбудованих цитат

R

resize	Визначає, чи може (і як) користувач змінювати розмір елемента
right	Визначає правильну позицію позиціонованого елемента
row-gap	Визначає проміжок між рядками сітки

S

scroll-behavior

Визначає, чи потрібно плавно анімувати позицію прокручування в полі, що прокручується, замість прямого переходу

T

tab-size	Визначає ширину символу табуляції
table-layout	Визначає алгоритм, який використовується для розміщення комірок, рядків і стовпців таблиці
text-align	Визначає горизонтальне вирівнювання тексту
text-align-last	Описує, як вирівнюється останній рядок блоку або рядок безпосередньо перед примусовим розривом рядка, коли для вирівнювання тексту встановлено "justify"
text-combine-upright	Визначає комбінацію кількох символів у пробілі одного символу
text-decoration	Визначає декорування, додане до тексту
text-decoration-color	Визначає колір text-decoration
text-decoration-line	Визначає тип лінії в text-decoration
text-decoration-style	Визначає стиль лінії в text-decoration
text-decoration-thickness	Визначає товщину декоративної лінії
text-emphasis	Застосовує знаки виділення до тексту
text-indent	Визначає відступ першого рядка в текстовому блоці
text-justify	Визначає метод вирівнювання, який використовується, коли є вирівнювання тексту "justify"
text-orientation	Визначає орієнтацію тексту в рядку
text-overflow	Визначає, що має статися, коли текст переповнює елемент, що містить
text-shadow	Додає тінь до тексту
text-transform	Контролює використання великих літер у тексті
text-underline-position	Визначає положення підкреслення, яке встановлюється за допомогою властивості text-decoration
top	Визначає верхню позицію позиціонованого елемента
transform	Застосовує 2D або 3D трансформацію до елемента
transform-origin	Дозволяє змінювати положення трансформованих елементів
transform-style	Визначає спосіб візуалізації вкладених елементів у 3D-просторі
transition	Скорочена властивість для всіх властивостей transition-*
transition-delay	Визначає, коли почнеться ефект переходу
transition-duration	Визначає, скільки секунд або мілісекунд потрібно для завершення ефекту переходу
transition-property	Визначає ім’я властивості CSS, для якого призначений ефект переходу
transition-timing-function	Визначає криву швидкості ефекту переходу

U

unicode-bidi	Використовується разом із властивістю direction, щоб установити або повернути, чи має бути перевизначений текст для підтримки кількох мов в одному документі
user-select	Визначає, чи можна виділити текст елемента

V

vertical-align	Встановлює вертикальне вирівнювання елемента
visibility	Визначає, чи є елемент видимим

W

white-space	Визначає, як обробляються пробіли всередині елемента
widows	Встановлює мінімальну кількість рядків, які потрібно залишити у верхній частині сторінки або стовпця
width	Встановлює ширину елемента
word-break	Визначає, як слова мають розриватися, коли вони досягають кінця рядка
word-spacing	Збільшує або зменшує пробіл між словами в тексті
word-wrap	Дозволяє розривати довгі, нерозривні слова та переносити їх на наступний рядок
writing-mode	Визначає горизонтальне чи вертикальне розміщення рядків тексту

Z

z-index

Встановлює порядок стека позиціонованого елемента