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
- Wartość
<color> | inherit
- Inicjalizacja
- zależy od przeglądarki
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- tak
- Procenty
- nie
opacity
- Wartość
<alphavalue> | inherit
- Inicjalizacja
- 1
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
Czcionki CSS
Źródło: CSS Fonts Module Level 3
font
- 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
- 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
- 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
- Wartość
none | <number>
- Inicjalizacja
- none
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- tak
- Procenty
- nie
- Media
- visual
font-stretch
- 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
- 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
- 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
- Wartość
normal | sub | super
- Inicjalizacja
- normal
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- tak
- Procenty
- nie
- Media
- visual
font-weight
- 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
- 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
- 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
- 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
- Wartość
auto | <color>
- Inicjalizacja
- auto
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- tak
- Procenty
- nie
- Media
- interactive
cursor
- 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
- Wartość
[ <'outline-color'> || <'outline-style'> || <'outline-width'> ]
- Inicjalizacja
- zobacz cechy indywidualne
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
- Media
- visual
outline-color
- Wartość
<color> | invert
- Inicjalizacja
- invert
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
- Media
- visual
outline-offset
outline-style
- Wartość
auto | <border-style>
- Inicjalizacja
- none
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
- Media
- visual
outline-width
- Wartość
<line-width>
- Inicjalizacja
- medium
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
- Media
- visual
resize
- 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
- 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
- Wartość
[<bg-layer> ,]? <final-bg-layer>
- Inicjalizacja
- zobacz cechy indywidualne
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- zobacz cechy indywidualne
background-attachment
- Wartość
<attachment>
- Inicjalizacja
- scroll
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
background-clip
- Wartość
<box>
- Inicjalizacja
- border-box
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
background-color
- Wartość
<color>
- Inicjalizacja
- transparent
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
background-image
- Wartość
<bg-image>
- Inicjalizacja
- none
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
background-origin
- Wartość
<box>
- Inicjalizacja
- padding-box
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
background-position
- 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
- Wartość
<repeat-style>
- Inicjalizacja
- repeat
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
background-size
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- Wartość
auto | <integer [1,∞]>
- Inicjalizacja
- auto
- Zastosowanie
- elementy blokowe z wyjątkiem tabel
- Dziedziczenie
- nie
- Procenty
- nie
column-fill
- 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
- Wartość
none | all
- Inicjalizacja
- none
- Zastosowanie
- wszystkie elementy blokowe bez ustawionego oblewania ani pozycjonowania absolutnego
- Dziedziczenie
- nie
- Procenty
- nie
column-width
- Wartość
auto | <length [0,∞]>
- Inicjalizacja
- auto
- Zastosowanie
- elementy blokowe z wyjątkiem tabel
- Dziedziczenie
- nie
- Procenty
- nie
columns
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
text-align
- 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
- 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
- Wartość
none | [capitalize | uppercase | lowercase ] || full-width || full-size-kana
- Inicjalizacja
- none
- Zastosowanie
- tekst
- Dziedziczenie
- tak
- Procenty
- nie
white-space
- 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
- 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
- Wartość
<integer>
- Inicjalizacja
- 2
- Zastosowanie
- elementy blokowe zawierające tekst lub elementy inline
- Dziedziczenie
- tak
- Procenty
- nie
- Media
- visual
widows
- 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
- Wartość
[ <display-outside> || <display-inside> ] | <display-listitem> | <display-internal> | <display-box> | <display-legacy>
- Inicjalizacja
- inline
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- nie
order
- Wartość
<integer>
- Inicjalizacja
- 0
- Zastosowanie
- dzieci kontenera elastycznego i dzieci kontenera układu siatki
- Dziedziczenie
- nie
- Procenty
- nie
visibility
- 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
- Wartość
<'margin-top'>{1,4}
- Inicjalizacja
- 0
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- odnosi się do logicznej szerokości bloku obejmującego
margin-bottom
- Wartość
<length-percentage> | auto
- Inicjalizacja
- 0
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- odnosi się do logicznej szerokości bloku obejmującego
margin-left
- Wartość
<length-percentage> | auto
- Inicjalizacja
- 0
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- odnosi się do logicznej szerokości bloku obejmującego
margin-right
- Wartość
<length-percentage> | auto
- Inicjalizacja
- 0
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- odnosi się do logicznej szerokości bloku obejmującego
margin-top
- 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
- Wartość
<length-percentage>
- Inicjalizacja
- 0
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- odnosi się do logicznej szerokości bloku obejmującego
padding-left
- Wartość
<length-percentage>
- Inicjalizacja
- 0
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- odnosi się do logicznej szerokości bloku obejmującego
padding-right
- Wartość
<length-percentage>
- Inicjalizacja
- 0
- Zastosowanie
- wszystkie elementy
- Dziedziczenie
- nie
- Procenty
- odnosi się do logicznej szerokości bloku obejmującego
padding-top
- 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