Przejdź do treści

CSS / Komendy CSS3 - Kurs CSS dla zielonych

Wstęp

Poniżej znajdziesz wykaz cech (własności) oraz ich wartości według oryginalnych specyfikacji CSS3, opracowanych przez organizację W3C.

Aby zobaczyć wyjaśnienie znaczenia poszczególnych elementów opisu, zapoznaj się z rozdziałem: Komendy CSS 2 / Wstęp.

Kolory CSS

Źródło: CSS Color Module Level 3

color

Kolor pierwszoplanowy

Wartość
<color> | inherit
Inicjalizacja
zależy od przeglądarki
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie

opacity

Przezroczystość

Wartość
<alphavalue> | inherit
Inicjalizacja
1
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

Czcionki CSS

Źródło: CSS Fonts Module Level 3

font

Atrybuty mieszane czcionki

Wartość
[ [ <'font-style'> || <font-variant-css21> || <'font-weight'> || <'font-stretch'> ]? <'font-size'> [ / <'line-height'> ]? <'font-family'> ] | caption | icon | menu | message-box | small-caption | status-bar
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
zobacz cechy indywidualne
Media
visual

font-family

Rodzaj czcionki

Wartość
[ <family-name> | <generic-family> ]
Inicjalizacja
zależy od przeglądarki
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-feature-settings

Niskopoziomowa kontrola ustawień własności czcionek

Wartość
normal | <feature-tag-value>
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-kerning

Odległość między znakami czcionki

Wartość
auto | normal | none
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-size

Wielkość czcionki

Wartość
<absolute-size> | <relative-size> | <length-percentage>
Inicjalizacja
medium
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
odnosi się do rozmiaru czcionki rodzica
Media
visual

font-size-adjust

Proporcje czcionki

Wartość
none | <number>
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-stretch

Rozciągnięcie czcionki

Wartość
normal | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-style

Styl czcionki

Wartość
normal | italic | oblique
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-synthesis

Kontrolowanie syntetycznej wagi i stylu

Wartość
none | [ weight || style ]
Inicjalizacja
weight style
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-variant

Atrybuty mieszane wariantu czcionki

Wartość
normal | none | [ <common-lig-values> || <discretionary-lig-values> || <historical-lig-values> || <contextual-alt-values> || [ small-caps | all-small-caps | petite-caps | all-petite-caps | unicase | titling-caps ] || <numeric-figure-values> || <numeric-spacing-values> || <numeric-fraction-values> || ordinal || slashed-zero || <east-asian-variant-values> || <east-asian-width-values> || ruby || [ sub | super ] ]
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
zobacz cechy indywidualne
Media
visual

font-variant-caps

Wariant wielkości liter czcionki

Wartość
normal | small-caps | all-small-caps | petite-caps | all-petite-caps | unicase | titling-caps
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-variant-east-asian

Wyświetlanie wschodnioazjatyckiego tekstu

Wartość
normal | [ <east-asian-variant-values> || <east-asian-width-values> || ruby ]
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-variant-ligatures

Wariant połączenia znaków czcionki

Wartość
normal | none | [ <common-lig-values> || <discretionary-lig-values> || <historical-lig-values> || <contextual-alt-values> ]
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-variant-numeric

Wariant liczb czcionki

Wartość
normal | [ <numeric-figure-values> || <numeric-spacing-values> || <numeric-fraction-values> || ordinal || slashed-zero ]
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-variant-position

Wariant pozycji czcionki

Wartość
normal | sub | super
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

font-weight

Waga czcionki

Wartość
normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

Tryby pisania CSS

Źródło: CSS Writing Modes Level 3

direction

Kierunek tekstu

Wartość
ltr | rtl
Inicjalizacja
ltr
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie

glyph-orientation-vertical

Pionowa orientacja znaków

Wartość
auto | 0deg | 90deg | 0 | 90
Inicjalizacja
nie
Zastosowanie
nie
Dziedziczenie
nie
Procenty
nie

text-combine-upright

Kompozycja pozioma w pionie

Wartość
none | all
Inicjalizacja
none
Zastosowanie
nie-zastępowane elementy inline
Dziedziczenie
tak
Procenty
nie

text-orientation

Orientacja tekstu

Wartość
mixed | upright | sideways
Inicjalizacja
mixed
Zastosowanie
wszystkie elementy z wyjątkiem wierszy, grup wierszy, kolumn i grup kolumn tabeli
Dziedziczenie
tak
Procenty
nie

unicode-bidi

Algorytm dwukierunkowego tekstu

Wartość
normal | embed | isolate | bidi-override | isolate-override | plaintext
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

writing-mode

Tryb pisania

Wartość
horizontal-tb | vertical-rl | vertical-lr
Inicjalizacja
horizontal-tb
Zastosowanie
wszystkie elementy z wyjątkiem grup wierszy, grup kolumn, wierszy i kolumn tabeli, a także bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
tak
Procenty
nie

Podstawowy interfejs użytkownika CSS

Źródło: CSS Basic User Interface Module Level 3 (CSS3 UI)

box-sizing

Wymiarowanie pudełka

Wartość
content-box | border-box
Inicjalizacja
content-box
Zastosowanie
wszystkie elementy, które akcektują szerokość i wysokość
Dziedziczenie
nie
Procenty
nie
Media
visual

caret-color

Kolor karetki tekstowej

Wartość
auto | <color>
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
interactive

cursor

Kursor myszki

Wartość
[ [<url> [<x> <y>]?,]* [ auto | default | none | context-menu | help | pointer | progress | wait | cell | crosshair | text | vertical-text | alias | copy | move | no-drop | not-allowed | grab | grabbing | e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize | sw-resize | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize | col-resize | row-resize | all-scroll | zoom-in | zoom-out ] ]
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual, interactive

outline

Atrybuty mieszane obrysu

Wartość
[ <'outline-color'> || <'outline-style'> || <'outline-width'> ]
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

outline-color

Kolor obrysu

Wartość
<color> | invert
Inicjalizacja
invert
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

outline-offset

Odstęp obrysu

Wartość
<length>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

outline-style

Styl obrysu

Wartość
auto | <border-style>
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

outline-width

Szerokość obrysu

Wartość
<line-width>
Inicjalizacja
medium
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

resize

Przeciąganie

Wartość
none | both | horizontal | vertical
Inicjalizacja
none
Zastosowanie
elementy z przepełnieniem innym niż visible i opcjonalnie elementy zastępowane takie jak obrazki, wideo, ramki lokalne
Dziedziczenie
nie
Procenty
nie
Media
visual

text-overflow

Przepełnienie tekstu

Wartość
clip | ellipsis
Inicjalizacja
clip
Zastosowanie
elementy blokowe
Dziedziczenie
nie
Procenty
nie
Media
visual

Zawieranie CSS

Źródło: CSS Containment Module Level 1

contain

Zawieranie

Wartość
none | strict | content | [ size || layout || paint ]
Inicjalizacja
none
Zastosowanie
wszystkie elementy, ale wybrane typy zawierania mogą nie działać dla niektórych elementów
Dziedziczenie
nie
Procenty
nie

Tło i obramowanie CSS

Źródło: CSS Backgrounds and Borders Module Level 3

background

Atrybuty mieszane tła

Wartość
[<bg-layer> ,]? <final-bg-layer>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
zobacz cechy indywidualne

background-attachment

Zaczepienie tła

Wartość
<attachment>
Inicjalizacja
scroll
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

background-clip

Przycinanie tła

Wartość
<box>
Inicjalizacja
border-box
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

background-color

Kolor tła

Wartość
<color>
Inicjalizacja
transparent
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

background-image

Tło obrazkowe

Wartość
<bg-image>
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

background-origin

Pozycja początkowa tła

Wartość
<box>
Inicjalizacja
padding-box
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

background-position

Pozycja tła

Wartość
<bg-position>
Inicjalizacja
0% 0%
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do powierzchni pozycjonowania tła minus rozmiar obrazka tła

background-repeat

Powtarzanie tła

Wartość
<repeat-style>
Inicjalizacja
repeat
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

background-size

Rozmiary tła

Wartość
<bg-size>
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do powierchni pozycjonowania tła

border

Atrybuty mieszane obramowania obramowania

Wartość
<line-width> || <line-style> || <color>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-bottom

Atrybuty mieszane dolnego obramowania

Wartość
<line-width> || <line-style> || <color>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-bottom-color

Kolor dolnego obramowania

Wartość
<color>
Inicjalizacja
currentColor
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-bottom-left-radius

Zaokrąglenie dolnego-lewego obramowania

Wartość
<length-percentage [0,∞]>{1,2}
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do wymiarów pudełka

border-bottom-right-radius

Zaokrąglenie dolnego-prawego obramowania

Wartość
<length-percentage [0,∞]>{1,2}
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do wymiarów pudełka

border-bottom-style

Styl dolnego obramowania

Wartość
<line-style>
Inicjalizacja
none
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-bottom-width

Szerokość dolnego obramowania

Wartość
<line-width>
Inicjalizacja
medium
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-color

Atrybuty mieszane koloru obramowania

Wartość
<color>{1,4}
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-image

Atrybuty mieszane obramowania obrazkowego

Wartość
<'border-image-source'> || <'border-image-slice'> [ / <'border-image-width'> | / <'border-image-width'>? / <'border-image-outset'> ]? || <'border-image-repeat'>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
zobacz cechy indywidualne
Dziedziczenie
nie
Procenty
nie

border-image-outset

Nawis obramowania obrazkowego

Wartość
[ <length [0,∞]> | <number [0,∞]> ]{1,4}
Inicjalizacja
0
Zastosowanie
wszystkie elementy z wyjątkiem wewnętrznych elementów tabeli w przypadku "border-collapse: collapse"
Dziedziczenie
nie
Procenty
nie

border-image-repeat

Powtarzanie obramowania obrazkowego

Wartość
[ stretch | repeat | round | space ]{1,2}
Inicjalizacja
stretch
Zastosowanie
wszystkie elementy z wyjątkiem wewnętrznych elementów tabeli w przypadku "border-collapse: collapse"
Dziedziczenie
nie
Procenty
nie

border-image-slice

Obcięcie obramowania obrazkowego

Wartość
[<number [0,∞]> | <percentage [0,∞]>]{1,4} && fill?
Inicjalizacja
100%
Zastosowanie
wszystkie elementy z wyjątkiem wewnętrznych elementów tabeli w przypadku "border-collapse: collapse"
Dziedziczenie
nie
Procenty
odnosi się do rozmiaru obrazka obramowania

border-image-source

Obramowanie obrazkowe

Wartość
none | <image>
Inicjalizacja
none
Zastosowanie
wszystkie elementy z wyjątkiem wewnętrznych elementów tabeli w przypadku "border-collapse: collapse"
Dziedziczenie
nie
Procenty
nie

border-image-width

Szerokość obramowania obrazkowego

Wartość
[ <length-percentage [0,∞]> | <number [0,∞]> | auto ]{1,4}
Inicjalizacja
1
Zastosowanie
wszystkie elementy z wyjątkiem wewnętrznych elementów tabeli w przypadku "border-collapse: collapse"
Dziedziczenie
nie
Procenty
odnosi się do szerokosći/wysokości obszaru obrazka obramowania

border-left

Atrybuty mieszane lewego obramowania

Wartość
<line-width> || <line-style> || <color>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-left-color

Kolor lewego obramowania

Wartość
<color>
Inicjalizacja
currentColor
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-left-style

Styl lewego obramowania

Wartość
<line-style>
Inicjalizacja
none
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-left-width

Szerokość lewego obramowania

Wartość
<line-width>
Inicjalizacja
medium
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-radius

Atrybuty mieszane zaokrąglenia

Wartość
<length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do wymiarów pudełka

border-right

Atrybuty mieszane prawego obramowania

Wartość
<line-width> || <line-style> || <color>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-right-color

Kolor prawego obramowania

Wartość
<color>
Inicjalizacja
currentColor
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-right-style

Styl prawego obramowania

Wartość
<line-style>
Inicjalizacja
none
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-right-width

Szerokość prawego obramowania

Wartość
<line-width>
Inicjalizacja
medium
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-style

Atrybuty mieszane stylu obramowania

Wartość
<line-style>{1,4}
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-top

Atrybuty mieszane górnego obramowania

Wartość
<line-width> || <line-style> || <color>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-top-color

Kolor górnego obramowania

Wartość
<color>
Inicjalizacja
currentColor
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-top-left-radius

Zaokraglenie górnego-lewego obramowania

Wartość
<length-percentage [0,∞]>{1,2}
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do wymiarów pudełka

border-top-right-radius

Zaokraglenie górnego-prawego obramowania

Wartość
<length-percentage [0,∞]>{1,2}
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do wymiarów pudełka

border-top-style

Styl górnego obramowania

Wartość
<line-style>
Inicjalizacja
none
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-top-width

Szerokość górnego obramowania

Wartość
<line-width>
Inicjalizacja
medium
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
nie

border-width

Atrybuty mieszane szerokości obramowania

Wartość
<line-width>{1,4}
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy z wyjątkiem bazowych i adnotacyjnych kontenerów przypisów ruby
Dziedziczenie
nie
Procenty
zobacz cechy indywidualne

box-shadow

Cień

Wartość
none | <shadow>
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

Układ wielokolumnowy CSS

Źródło: CSS Multi-column Layout Module Level 1

column-count

Liczba kolumn

Wartość
auto | <integer [1,∞]>
Inicjalizacja
auto
Zastosowanie
elementy blokowe z wyjątkiem tabel
Dziedziczenie
nie
Procenty
nie

column-fill

Wypełnienie kolumn

Wartość
auto | balance | balance-all
Inicjalizacja
balance
Zastosowanie
kontenery układu wielokolumnowego
Dziedziczenie
nie
Procenty
nie

column-rule

Atrybuty mieszane linii rozdzielająca kolumny

Wartość
<'column-rule-width'> || <'column-rule-style'> || <'column-rule-color'>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
zobacz cechy indywidualne
Dziedziczenie
zobacz cechy indywidualne
Procenty
zobacz cechy indywidualne

column-rule-color

Kolor linii rozdzielająca kolumny

Wartość
<color>
Inicjalizacja
currentcolor
Zastosowanie
kontenery układu wielokolumnowego
Dziedziczenie
nie
Procenty
nie

column-rule-style

Styl linii rozdzielająca kolumny

Wartość
<line-style>
Inicjalizacja
none
Zastosowanie
kontenery układu wielokolumnowego
Dziedziczenie
nie
Procenty
nie

column-rule-width

Szerokość linii rozdzielająca kolumny

Wartość
<line-width>
Inicjalizacja
medium
Zastosowanie
kontenery układu wielokolumnowego
Dziedziczenie
nie
Procenty
nie

column-span

Łączenie kolumn

Wartość
none | all
Inicjalizacja
none
Zastosowanie
wszystkie elementy blokowe bez ustawionego oblewania ani pozycjonowania absolutnego
Dziedziczenie
nie
Procenty
nie

column-width

Szerokość kolumny

Wartość
auto | <length [0,∞]>
Inicjalizacja
auto
Zastosowanie
elementy blokowe z wyjątkiem tabel
Dziedziczenie
nie
Procenty
nie

columns

Atrybuty mieszane kolumn

Wartość
<'column-width'> || <'column-count'>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
zobacz cechy indywidualne
Dziedziczenie
zobacz cechy indywidualne
Procenty
zobacz cechy indywidualne

Układ elastyczny CSS

Źródło: CSS Flexible Box Layout Module Level 1

align-content

Wyrównanie wierszy

Wartość
flex-start | flex-end | center | space-between | space-around | stretch
Inicjalizacja
stretch
Zastosowanie
kontener elastyczny, którego elementy zostały ułożone w wielu wierszach
Dziedziczenie
nie
Procenty
nie

align-items

Wspólne wyrównanie wiersza

Wartość
flex-start | flex-end | center | baseline | stretch
Inicjalizacja
stretch
Zastosowanie
kontener elastyczny
Dziedziczenie
nie
Procenty
nie

align-self

Indywidualne wyrównanie wiersza

Wartość
auto | flex-start | flex-end | center | baseline | stretch
Inicjalizacja
auto
Zastosowanie
dzieci kontenera elastycznego
Dziedziczenie
nie
Procenty
nie

flex

Atrybuty mieszane układu elastycznego

Wartość
none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]
Inicjalizacja
0 1 auto
Zastosowanie
dzieci kontenera elastycznego
Dziedziczenie
nie
Procenty
zobacz cechy indywidualne

flex-basis

Baza układu elastycznego

Wartość
content | <'width'>
Inicjalizacja
auto
Zastosowanie
dzieci kontenera elastycznego
Dziedziczenie
nie
Procenty
odnosi się do wewnętrznego rozmiaru kontenera elastycznego

flex-direction

Kierunek przepływu układu elastycznego

Wartość
row | row-reverse | column | column-reverse
Inicjalizacja
row
Zastosowanie
kontener elastyczny
Dziedziczenie
nie
Procenty
nie

flex-flow

Atrybuty mieszane przepływu układu elastycznego

Wartość
<'flex-direction'> || <'flex-wrap'>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
zobacz cechy indywidualne
Dziedziczenie
zobacz cechy indywidualne
Procenty
zobacz cechy indywidualne

flex-grow

Rozciągnięcie układu elastycznego

Wartość
<number>
Inicjalizacja
0
Zastosowanie
dzieci kontenera elastycznego
Dziedziczenie
nie
Procenty
nie

flex-shrink

Ściśnięcie układu elastycznego

Wartość
<number>
Inicjalizacja
1
Zastosowanie
dzieci kontenera elastycznego
Dziedziczenie
nie
Procenty
nie

flex-wrap

Zawijanie przepływu układu elastycznego

Wartość
nowrap | wrap | wrap-reverse
Inicjalizacja
nowrap
Zastosowanie
kontener elastyczny
Dziedziczenie
nie
Procenty
nie

justify-content

Justowanie zawartości układu elastycznego

Wartość
flex-start | flex-end | center | space-between | space-around
Inicjalizacja
flex-start
Zastosowanie
kontener elastyczny
Dziedziczenie
nie
Procenty
nie

order

Kolejność układu elastycznego

Wartość
<integer>
Inicjalizacja
0
Zastosowanie
dzieci kontenera elastycznego
Dziedziczenie
nie
Procenty
nie

Obrazki CSS

Źródło: CSS Images Module Level 3

image-orientation

Orientacja obrazka na stronie

Wartość
from-image | none | [ <angle> || flip ]
Inicjalizacja
from-image
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie

image-rendering

Określenie jak przeskalozwać obrazek

Wartość
auto | smooth | high-quality | crisp-edges | pixelated
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie

object-fit

Dopasowywanie rozmiaru obiektów

Wartość
fill | contain | cover | none | scale-down
Inicjalizacja
fill
Zastosowanie
elementy zastępowane
Dziedziczenie
nie
Procenty
nie

object-position

Pozycjonowanie obiektów

Wartość
<position>
Inicjalizacja
50% 50%
Zastosowanie
elementy zastępowane
Dziedziczenie
nie
Procenty
odnosi się do szerokości i wysokości elementu

Mowa CSS

Źródło: CSS Speech Module

cue

Atrybuty mieszane sygnału wywoławczego

Wartość
<'cue-before'> <'cue-after'>?
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
speech

cue-after

Sygnał wywoławczy po...

Wartość
<uri> <decibel>? | none
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
speech

cue-before

Sygnał wywoławczy przed...

Wartość
<uri> <decibel>? | none
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
speech

pause

Atrybuty mieszane przerwy

Wartość
<'pause-before'> <'pause-after'>?
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
speech

pause-after

Przerwa po...

Wartość
<time> | none | x-weak | weak | medium | strong | x-strong
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
speech

pause-before

Przerwa przed...

Wartość
<time> | none | x-weak | weak | medium | strong | x-strong
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
speech

rest

Atrybuty mieszane spoczynku

Wartość
<'rest-before'> <'rest-after'>?
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
speech

rest-after

Spoczynek po...

Wartość
<time> | none | x-weak | weak | medium | strong | x-strong
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
speech

rest-before

Spoczynek przed...

Wartość
<time> | none | x-weak | weak | medium | strong | x-strong
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
speech

speak

Parametry mowy

Wartość
auto | never | always
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
speech

speak-as

Sposób wymowy

Wartość
normal | spell-out || digits || [ literal-punctuation | no-punctuation ]
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
speech

voice-balance

Balans głosu

Wartość
<number> | left | center | right | leftwards | rightwards
Inicjalizacja
center
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
speech

voice-duration

Czas trwania głosu

Wartość
auto | <time>
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
speech

voice-family

Rodzina głosów

Wartość
[[<name> | <generic-voice>],]* [<name> | <generic-voice>] | preserve
Inicjalizacja
zależy od przeglądarki
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
speech

voice-pitch

Wysokość głosu

Wartość
<frequency> && absolute | [[x-low | low | medium | high | x-high] || [<frequency> | <semitones> | <percentage>]]
Inicjalizacja
medium
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
odnosi się do odziedziczonej wartości
Media
speech

voice-range

Zakres głosu

Wartość
<frequency> && absolute | [[x-low | low | medium | high | x-high] || [<frequency> | <semitones> | <percentage>]]
Inicjalizacja
medium
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
odnosi się do odziedziczonej wartości
Media
speech

voice-rate

Tempo głosu

Wartość
[normal | x-slow | slow | medium | fast | x-fast] || <percentage>
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
odnosi się do domyślej wartości
Media
speech

voice-stress

Akcent głosu

Wartość
normal | strong | moderate | none | reduced
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
speech

voice-volume

Głośność głosu

Wartość
silent | [[x-soft | soft | medium | loud | x-loud] || <decibel>]
Inicjalizacja
medium
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
speech

Dekoracja tekstu CSS

Źródło: CSS Text Decoration Module Level 3

text-decoration

Dekoracja tekstu

Wartość
<'text-decoration-line'> || <'text-decoration-style'> || <'text-decoration-color'>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
zobacz cechy indywidualne
Dziedziczenie
zobacz cechy indywidualne
Procenty
zobacz cechy indywidualne

text-decoration-color

Kolor dekoracji tekstu

Wartość
<color>
Inicjalizacja
currentcolor
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

text-decoration-line

Linie dekoracji tekstu

Wartość
none | [ underline || overline || line-through || blink ]
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

text-decoration-style

Styl dekoracji tekstu

Wartość
solid | double | dotted | dashed | wavy
Inicjalizacja
solid
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

text-emphasis

Atrybuty mieszane wzmocnienia tekstu

Wartość
<'text-emphasis-style'> || <'text-emphasis-color'>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
zobacz cechy indywidualne
Dziedziczenie
zobacz cechy indywidualne
Procenty
zobacz cechy indywidualne

text-emphasis-color

Kolor wzmocnienia tekstuE

Wartość
<color>
Inicjalizacja
currentcolor
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie

text-emphasis-position

Pozycja wzmocnienia tekstuE

Wartość
[ over | under ] && [ right | left ]?
Inicjalizacja
over right
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie

text-emphasis-style

Styl wzmocnienia tekstuE

Wartość
none | [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] | <string>
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie

text-shadow

Cień tekstu

Wartość
none | [ <color>? && <length>{2,3} ]
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie

text-underline-position

Pozycja podkreśleia tekstu

Wartość
auto | [ under || [ left | right ] ]
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie

Kształty CSS

Źródło: CSS Shapes Module Level 1

shape-outside

Kształt obszaru oblewania

Wartość
none | [ <basic-shape> || <shape-box> ] | <image>
Inicjalizacja
none
Zastosowanie
elementy z oblewaniem (float)
Dziedziczenie
nie
Media
visual

shape-image-threshold

Wybór pikseli obrazka obszaru oblewania

Wartość
<number>
Inicjalizacja
0.0
Zastosowanie
elementy z oblewaniem (float)
Dziedziczenie
nie
Media
visual

shape-margin

Margines obszaru oblewania

Wartość
<length> | <percentage>
Inicjalizacja
0
Zastosowanie
elementy z oblewaniem (float)
Dziedziczenie
nie
Media
visual

Maskowanie CSS

Źródło: CSS Masking Module Level 1

clip

Obcinanie

Wartość
rect() | auto
Inicjalizacja
auto
Zastosowanie
elementy pozycjonowane absolutnie
Dziedziczenie
nie
Procenty
nie
Media
visual

clip-path

Kształt obcinania

Wartość
<clip-source> | [ <basic-shape> || <geometry-box> ] | none
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

clip-rule

Reguły obcinania

Wartość
nonzero | evenodd
Inicjalizacja
nonzero
Zastosowanie
elementy grafiki SVG
Dziedziczenie
tak
Procenty
nie
Media
visual

mask

Atrybuty mieszane maski

Wartość
<mask-layer>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
zobacz cechy indywidualne
Media
visual

mask-border

Atrybuty mieszane maski obrazka obramowania

Wartość
<'mask-border-source'> || <'mask-border-slice'> [ / <'mask-border-width'>? [ / <'mask-border-outset'> ]? ]? || <'mask-border-repeat'> || <'mask-border-mode'>
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
zobacz cechy indywidualne
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-border-mode

Tryb maski obrazka obramowania

Wartość
luminance | alpha
Inicjalizacja
alpha
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-border-outset

Nawis krawędzi

Wartość
[ <length> | <number> ]{1,4}
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-border-repeat

Powtarzanie maski obrazka obramowania

Wartość
[ stretch | repeat | round | space ]{1,2}
Inicjalizacja
stretch
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-border-slice

Obcięcie maski obrazka obramowania

Wartość
<number-percentage>{1,4} fill?
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do rozmiaru maski obrazka obramowania
Media
visual

mask-border-source

Źródło maski obrazka obramowania

Wartość
none | <image>
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-border-width

Szerokość maski obrazka obramowania

Wartość
[ <length-percentage> | <number> | auto ]{1,4}
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do szerokosći/wysokości obszaru maski obrazka obramowani
Media
visual

mask-clip

Obcięcie maski

Wartość
[ <geometry-box> | no-clip ]
Inicjalizacja
border-box
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-composite

Komponowanie warstw maski

Wartość
<compositing-operator>
Inicjalizacja
add
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-image

Źródło obrazka maski

Wartość
<mask-reference>
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-mode

Tryb maski obrazka

Wartość
<masking-mode>
Inicjalizacja
match-source
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-origin

Obszar pozycjonowania

Wartość
<geometry-box>
Inicjalizacja
border-box
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-position

Pozysjonowanie maski obrazka

Wartość
<position>
Inicjalizacja
0% 0%
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do powierzchni pozycjonowania maski minus rozmiar obrazka maski
Media
visual

mask-repeat

Powtarzanie maski obrazka

Wartość
<repeat-style>
Inicjalizacja
repeat
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-size

Dopasowywanie rozmiaru maski obrazka

Wartość
<bg-size>
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

mask-type

Typ maski

Wartość
luminance | alpha
Inicjalizacja
luminance
Zastosowanie
elementy maski
Dziedziczenie
nie
Procenty
nie
Media
visual

Tekst CSS

Źródło: CSS Text Module Level 3

hanging-punctuation

Zawieszenie znaków interpunkcyjnych

Wartość
none | [ first || [ force-end | allow-end ] || last ]
Inicjalizacja
none
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

hyphens

Dzielenie

Wartość
none | manual | auto
Inicjalizacja
manual
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

letter-spacing

Odstęp między literami

Wartość
normal | <length>
Inicjalizacja
normal
Zastosowanie
tekst i elementy inline w przypadku "display: flow"
Dziedziczenie
tak
Procenty
nie

line-break

Ścisłość przełamania linii

Wartość
auto | loose | normal | strict | anywhere
Inicjalizacja
auto
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

overflow-wrap

Przycinanie zawijania

Wartość
normal | break-word | anywhere
Inicjalizacja
normal
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

tab-size

Rozmiar znaku tabulacji

Wartość
<number> | <length>
Inicjalizacja
8
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

text-align

Wyrównanie tekstu

Wartość
start | end | left | right | center | justify | match-parent | justify-all
Inicjalizacja
start
Zastosowanie
elementy blokowe
Dziedziczenie
tak
Procenty
zobacz cechy indywidualne

text-align-all

Domyślne wyrównanie tekstu

Wartość
start | end | left | right | center | justify | match-parent
Inicjalizacja
start
Zastosowanie
elementy blokowe
Dziedziczenie
tak
Procenty
nie

text-align-last

Wyrównanie ostatniej linii tekstu

Wartość
auto | start | end | left | right | center | justify | match-parent
Inicjalizacja
auto
Zastosowanie
elementy blokowe
Dziedziczenie
tak
Procenty
nie

text-indent

Wcięcie

Wartość
[ <length-percentage> ] && hanging? && each-line?
Inicjalizacja
0
Zastosowanie
elementy blokowe
Dziedziczenie
tak
Procenty
odnosi się do rozmiaru kontenera w kierunku pisania

text-justify

Metoda justowania tesktu

Wartość
auto | none | inter-word | inter-character
Inicjalizacja
auto
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

text-transform

Transformacja tekstu

Wartość
none | [capitalize | uppercase | lowercase ] || full-width || full-size-kana
Inicjalizacja
none
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

white-space

Białe znaki

Wartość
normal | pre | nowrap | pre-wrap | break-spaces | pre-line
Inicjalizacja
normal
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

word-break

Reguły przełamywania dla liter

Wartość
normal | keep-all | break-all | break-word
Inicjalizacja
normal
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

word-spacing

Odstęp między wyrazami

Wartość
normal | <length>
Inicjalizacja
normal
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

word-wrap

Zawijanie wyrazów

Wartość
normal | break-word | anywhere
Inicjalizacja
normal
Zastosowanie
tekst
Dziedziczenie
tak
Procenty
nie

Fragmentacja CSS

Źródło: CSS Fragmentation Module Level 3

box-decoration-break

Dekoracja przełamania

Wartość
slice | clone
Inicjalizacja
slice
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

break-after

Przełamanie po...

Wartość
auto | avoid | avoid-page | page | left | right | recto | verso | avoid-column | column | avoid-region | region
Inicjalizacja
auto
Zastosowanie
elementy blokowe, dzieci kontenera układu siatki, dzieci kontenera elastycznego, wiersze i grupy wierszy tabeli
Dziedziczenie
nie
Procenty
nie
Media
visual

break-before

Przełamanie przed...

Wartość
auto | avoid | avoid-page | page | left | right | recto | verso | avoid-column | column | avoid-region | region
Inicjalizacja
auto
Zastosowanie
elementy blokowe, dzieci kontenera układu siatki, dzieci kontenera elastycznego, wiersze i grupy wierszy tabeli
Dziedziczenie
nie
Procenty
nie
Media
visual

break-inside

Blokada przełamania

Wartość
auto | avoid | avoid-page | avoid-column | avoid-region
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

orphans

Samotne linijki na dole

Wartość
<integer>
Inicjalizacja
2
Zastosowanie
elementy blokowe zawierające tekst lub elementy inline
Dziedziczenie
tak
Procenty
nie
Media
visual

widows

Samotne linijki na górze

Wartość
<integer>
Inicjalizacja
2
Zastosowanie
elementy blokowe zawierające tekst lub elementy inline
Dziedziczenie
tak
Procenty
nie
Media
visual

Przekształcenia CSS

Źródło: CSS Transforms Module Level 1

transform

Przekształcenia

Wartość
none | <transform-list>
Inicjalizacja
none
Zastosowanie
przekształcalne elementy - tzn. takie, których ułożenie jest kontrolowane przez CSS z wyjątkiem nie-zastępowanych elementów inline, kolumn i grup kolumn tabeli
Dziedziczenie
nie
Procenty
odnosi się do rozmiaru obszaru odniesienia

transform-box

Obszar odniesienia przekształcenia

Wartość
content-box | border-box | fill-box | stroke-box | view-box
Inicjalizacja
view-box
Zastosowanie
przekształcalne elementy - tzn. takie, których ułożenie jest kontrolowane przez CSS z wyjątkiem nie-zastępowanych elementów inline, kolumn i grup kolumn tabeli
Dziedziczenie
nie
Procenty
nie

transform-origin

Początek przekształcenia

Wartość
[ left | center | right | top | bottom | <length-percentage> ] |   [ left | center | right | <length-percentage> ]  [ top | center | bottom | <length-percentage> ] <length>? |  [[ center | left | right ] && [ center | top | bottom ]] <length>?
Inicjalizacja
50% 50%
Zastosowanie
przekształcalne elementy - tzn. takie, których ułożenie jest kontrolowane przez CSS z wyjątkiem nie-zastępowanych elementów inline, kolumn i grup kolumn tabeli
Dziedziczenie
nie
Procenty
odnosi się do rozmiaru obszaru odniesienia

Komponowanie i mieszanie CSS

Źródło: Compositing and Blending Level 1

mix-blend-mode

Tryb mieszania

Wartość
<blend-mode>
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

isolation

Izolacja

Wartość
<isolation-mode>
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

background-blend-mode

Tryb mieszania tła

Wartość
<blend-mode>
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
visual

Układ siatki CSS

Źródło: CSS Grid Layout Module Level 1

grid

Atrybuty mieszane układu siatki

Wartość
<'grid-template'> | <'grid-template-rows'> / [ auto-flow && dense? ] <'grid-auto-columns'>? | [ auto-flow && dense? ] <'grid-auto-rows'>? / <'grid-template-columns'>
Inicjalizacja
none
Zastosowanie
kontenery układu siatki
Dziedziczenie
zobacz cechy indywidualne
Procenty
zobacz cechy indywidualne

grid-area

Obszar układu siatki

Wartość
<grid-line> [ / <grid-line> ]{0,3}
Inicjalizacja
auto
Zastosowanie
dzieci kontenera układu siatki i elementy pozycjonowane absolutnie, których blok obejmujący jest kontenerem układu siatki
Dziedziczenie
nie
Procenty
nie

grid-auto-columns

Automatyczne kolumny układu siatki

Wartość
<track-size>+
Inicjalizacja
auto
Zastosowanie
kontenery układu siatki
Dziedziczenie
nie
Procenty
zobacz grid-template-columns i grid-template-columns

grid-auto-flow

Automatyczny przepływ układu siatki

Wartość
[ row | column ] || dense
Inicjalizacja
row
Zastosowanie
kontenery układu siatki
Dziedziczenie
nie
Procenty
nie

grid-auto-rows

Automatyczne wiersze układu siatki

Wartość
<track-size>+
Inicjalizacja
auto
Zastosowanie
kontenery układu siatki
Dziedziczenie
nie
Procenty
zobacz grid-template-columns i grid-template-columns

grid-column

Atrybuty mieszane kolumny układu siatki

Wartość
<grid-line> [ / <grid-line> ]?
Inicjalizacja
auto
Zastosowanie
dzieci kontenera układu siatki i elementy pozycjonowane absolutnie, których blok obejmujący jest kontenerem układu siatki
Dziedziczenie
nie
Procenty
nie

grid-column-end

Kolumna końcowa układu siatki

Wartość
<grid-line>
Inicjalizacja
auto
Zastosowanie
dzieci kontenera układu siatki i elementy pozycjonowane absolutnie, których blok obejmujący jest kontenerem układu siatki
Dziedziczenie
nie
Procenty
nie

grid-column-start

Kolumna początkowa układu siatki

Wartość
<grid-line>
Inicjalizacja
auto
Zastosowanie
dzieci kontenera układu siatki i elementy pozycjonowane absolutnie, których blok obejmujący jest kontenerem układu siatki
Dziedziczenie
nie
Procenty
nie

grid-row

Wiersz układu siatki

Wartość
<grid-line> [ / <grid-line> ]?
Inicjalizacja
auto
Zastosowanie
dzieci kontenera układu siatki i elementy pozycjonowane absolutnie, których blok obejmujący jest kontenerem układu siatki
Dziedziczenie
nie
Procenty
nie

grid-row-end

Wiersz końcowy układu siatki

Wartość
<grid-line>
Inicjalizacja
auto
Zastosowanie
dzieci kontenera układu siatki i elementy pozycjonowane absolutnie, których blok obejmujący jest kontenerem układu siatki
Dziedziczenie
nie
Procenty
nie

grid-row-start

Wiersz początkowy układu siatki

Wartość
<grid-line>
Inicjalizacja
auto
Zastosowanie
dzieci kontenera układu siatki i elementy pozycjonowane absolutnie, których blok obejmujący jest kontenerem układu siatki
Dziedziczenie
nie
Procenty
nie

grid-template

Szablon układu siatki

Wartość
none | [ <'grid-template-rows'> / <'grid-template-columns'> ] | [ <line-names>? <string> <track-size>? <line-names>? ]+ [ / <explicit-track-list> ]?
Inicjalizacja
none
Zastosowanie
kontenery układu siatki
Dziedziczenie
zobacz cechy indywidualne
Procenty
zobacz cechy indywidualne

grid-template-areas

Obszary szablonu układu siatki

Wartość
none | <string>+
Inicjalizacja
none
Zastosowanie
kontenery układu siatki
Dziedziczenie
nie
Procenty
nie

grid-template-columns

Kolumny szablonu układu siatki

Wartość
none | <track-list> | <auto-track-list>
Inicjalizacja
none
Zastosowanie
kontenery układu siatki
Dziedziczenie
nie
Procenty
odnosi się do odpowiedniego wymiaru obszaru zawartości

grid-template-rows

Wiersze szablonu układu siatki

Wartość
none | <track-list> | <auto-track-list>
Inicjalizacja
none
Zastosowanie
kontenery układu siatki
Dziedziczenie
nie
Procenty
odnosi się do odpowiedniego wymiaru obszaru zawartości

Wyświetlanie CSS

Źródło: CSS Display Module Level 3

display

Wyświetlanie

Wartość
[ <display-outside> || <display-inside> ] | <display-listitem> | <display-internal> | <display-box> | <display-legacy>
Inicjalizacja
inline
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

order

Kolejność

Wartość
<integer>
Inicjalizacja
0
Zastosowanie
dzieci kontenera elastycznego i dzieci kontenera układu siatki
Dziedziczenie
nie
Procenty
nie

visibility

Widzialność

Wartość
visible | hidden | collapse
Inicjalizacja
visible
Zastosowanie
wszystkie elementy
Dziedziczenie
tak
Procenty
nie
Media
visual

Podpowiedzi dla przeglądarki CSS

Źródło: CSS Will Change Module Level 1

will-change

Podpowiedź renderowania dla przeglądarki

Wartość
auto | <animateable-feature>
Inicjalizacja
auto
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie
Media
all

Model pudełkowy CSS

Źródło: CSS Box Model Module Level 3

margin

Atrybuty mieszane marginesu

Wartość
<'margin-top'>{1,4}
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do logicznej szerokości bloku obejmującego

margin-bottom

Dolny margines

Wartość
<length-percentage> | auto
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do logicznej szerokości bloku obejmującego

margin-left

Lewy margines

Wartość
<length-percentage> | auto
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do logicznej szerokości bloku obejmującego

margin-right

Prawy margines

Wartość
<length-percentage> | auto
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do logicznej szerokości bloku obejmującego

margin-top

Górny margines

Wartość
<length-percentage> | auto
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do logicznej szerokości bloku obejmującego

padding

Atrybuty mieszane marginesu wewnętrznego

Wartość
<'padding-top'>{1,4}
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do logicznej szerokości bloku obejmującego

padding-bottom

Dolny wewnętrzny margines

Wartość
<length-percentage>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do logicznej szerokości bloku obejmującego

padding-left

Lewy wewnętrzny margines

Wartość
<length-percentage>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do logicznej szerokości bloku obejmującego

padding-right

Prawy wewnętrzny margines

Wartość
<length-percentage>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do logicznej szerokości bloku obejmującego

padding-top

Górny wewnętrzny margines

Wartość
<length-percentage>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
odnosi się do logicznej szerokości bloku obejmującego

Kaskadowość i dziedziczenie CSS

Źródło: CSS Cascading and Inheritance Level 4

all

Resetowanie wszystkich cech

Wartość
initial | inherit | unset | revert
Inicjalizacja
zobacz cechy indywidualne
Zastosowanie
zobacz cechy indywidualne
Dziedziczenie
zobacz cechy indywidualne
Procenty
zobacz cechy indywidualne

Przyciąganie przewijania CSS

Źródło: CSS Scroll Snap Module Level 1

scroll-margin

Margines przewijania

Wartość
<length>{1,4}
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-margin-block

Blok marginesu przewijania

Wartość
<length>{1,2}
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-margin-block-end

Koniec bloku marginesu przewijania

Wartość
<length>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-margin-block-start

Początek bloku marginesu przewijania

Wartość
<length>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-margin-bottom

Dolny margines przewijania

Wartość
<length>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-margin-inline

Margines przewijania inline

Wartość
<length>{1,2}
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-margin-inline-end

Koniec marginesu przewijania inline

Wartość
<length>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-margin-inline-start

Początek marginesu przewijania inline

Wartość
<length>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-margin-left

Lewy margines przewijania

Wartość
<length>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-margin-right

Prawy margines przewijania

Wartość
<length>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-margin-top

Górny margines przewijania

Wartość
<length>
Inicjalizacja
0
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-padding

Wewnętrzny margines przewijania

Wartość
[ auto | <length-percentage> ]{1,4}
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do odpowiedniego wymiaru obszaru przewijania

scroll-padding-block

Blok wewnętrznego marginesu przewijania

Wartość
[ auto | <length-percentage> ]{1,2}
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do obszaru przewijania

scroll-padding-block-end

Koniec bloku wewnętrznego marginesu przewijania

Wartość
auto | <length-percentage>
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do obszaru przewijania

scroll-padding-block-start

Początek bloku wewnętrznego marginesu przewijania

Wartość
auto | <length-percentage>
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do obszaru przewijania

scroll-padding-bottom

Dolny wewnętrzny margines przewijania

Wartość
auto | <length-percentage>
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do obszaru przewijania

scroll-padding-inline

Wewnętrzny margines przewijania inline

Wartość
[ auto | <length-percentage> ]{1,2}
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do obszaru przewijania

scroll-padding-inline-end

Koniec wewnętrznego marginesu przewijania inline

Wartość
auto | <length-percentage>
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do obszaru przewijania

scroll-padding-inline-start

Początek wewnętrznego marginesu przewijania inline

Wartość
auto | <length-percentage>
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do obszaru przewijania

scroll-padding-left

Lewy wewnętrzny margines przewijania

Wartość
auto | <length-percentage>
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do obszaru przewijania

scroll-padding-right

Prawy wewnętrzny margines przewijania

Wartość
auto | <length-percentage>
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do obszaru przewijania

scroll-padding-top

Górny wewnętrzny margines przewijania

Wartość
auto | <length-percentage>
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
odnosi się do obszaru przewijania

scroll-snap-align

Wyrównanie przyciągania przewijania

Wartość
[ none | start | end | center ]{1,2}
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-snap-stop

Zatrzymanie przyciągania przewijania

Wartość
normal | always
Inicjalizacja
normal
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

scroll-snap-type

Typ przyciągania przewijania

Wartość
none | [ x | y | block | inline | both ] [ mandatory | proximity ]?
Inicjalizacja
none
Zastosowanie
wszystkie elementy
Dziedziczenie
nie
Procenty
nie

Paski przewijania CSS

Źródło: CSS Scrollbars Styling Module Level 1

scrollbar-color

Kolor paska przewijania

Wartość
auto | <color>{2}
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
tak
Procenty
nie

scrollbar-width

Szerokość paska przewijania

Wartość
auto | thin | none
Inicjalizacja
auto
Zastosowanie
kontenery przewijania
Dziedziczenie
nie
Procenty
nie
Facebook