CSS is a cascading style sheet language that defines the visual styling for HTML, SVG, and other markup languages.
Articles in the “CSS” section by topic
Basics
Selectors
Pseudo-classes
- Pseudo-classes
-
:link
-
:visited
-
:hover
-
:active
-
:target
- Pseudo-classes of the child group
- Pseudoclasses of the type group
-
:focus
-
:focus
- visible -
:focus
- within -
:not
-
:checked
-
:disabled
,:enabled
-
:empty
-
:has
( ) -
:is
( ) -
:where
( ) -
:in
,- range :out
- of - range -
:required
-
:optional
-
:invalid
,:valid
-
:placeholder
- shown -
:default
-
:lang
-
:root
-
:indeterminate
Pseudo-elements
Functions
Directives
Global keywords
Colors in web
Units of measurement
Animations
Transformations
Background
-
background
-
background
- color -
background
- image -
background
- position -
background
- repeat -
background
- size -
background
- attachment -
background
- clip -
background
- origin -
background
- blend - mode -
linear
- gradient ( ) -
repeating
- linear - gradient ( ) -
radial
- gradient ( ) -
repeating
- radial - gradient ( ) -
conic
- gradient ( ) -
repeating
- conic - gradient ( ) -
image
- set ( ) -
backdrop
- filter - Filter Functions
Text handling
-
color
-
font
- family -
font
- size -
line
- height -
text
- align -
text
- transform -
vertical
- align -
@font
- face -
font
- style -
font
- weight -
font
- display -
font
-
font
- smooth -
letter
- spacing -
text
- decoration -
text
- decoration - color -
text
- decoration - line -
text
- decoration - style -
text
- decoration - thickness -
text
- decoration - skip - ink -
text
- rendering -
text
- shadow -
white
- space -
quotes
-
overflow
- wrap -
hyphens
-
text
- indent -
text
- justify -
text
- orientation -
text
- overflow -
text
- size - adjust -
text
- underline - offset -
text
- underline - position -
word
- break -
word
- spacing -
word
- wrap -
writing
- mode -
tab
- size
Variable fonts
Sizes and margins
Positioning
Lists
Flexboxes
Grids
Block alignment
Forms
!important
Visibility
Overflow
Float
Image handling
Borders, outlines and shadows
Interface and interactions
SVG
Custom properties
Print styles
Columns and tables
Counters
Остальные
Articles in the section “CSS” in alphabetical order
a
-
accent
Applies to topic: Forms- color -
:active
Applies to topic: Pseudo-classes -
:
Applies to topic: Pseudo-elements: after -
align
Applies to topic: Block alignment- content -
align
Applies to topic: Block alignment- items -
align
Applies to topic: Block alignment- self -
all
Applies to topic: Basics -
animation
Applies to topic: Animations- delay -
animation
Applies to topic: Animations- direction -
animation
Applies to topic: Animations- duration -
animation
Applies to topic: Animations- fill - mode -
animation
Applies to topic: Animations- iteration - count -
animation
Applies to topic: Animations- name -
animation
Applies to topic: Animations- play - state -
animation
Applies to topic: Animations- timing - function -
appearance
Applies to topic: Forms - Approach 'Pixel Perfect' Applies to topic: Basics
-
aspect
Applies to topic: Image handling- ratio -
attr
Applies to topic: Functions( ) - Attribute Selector Applies to topic: Selectors
b
-
:
Applies to topic: Pseudo-elements: backdrop -
backdrop
Applies to topic: Background- filter -
backface
Applies to topic: Transformations- visibility -
background
Applies to topic: Background -
background
Applies to topic: Background- attachment -
background
Applies to topic: Background- blend - mode -
background
Applies to topic: Background- clip -
background
Applies to topic: Background- color -
background
Applies to topic: Background- image -
background
Applies to topic: Background- origin -
background
Applies to topic: Background- position -
background
Applies to topic: Background- repeat -
background
Applies to topic: Background- size -
:
Applies to topic: Pseudo-elements: before - Block Model Applies to topic: Basics
-
border
Applies to topic: Borders, outlines and shadows -
border
Applies to topic: Borders, outlines and shadows- block -
border
Applies to topics: Borders, outlines and shadows Columns and tables- collapse -
border
Applies to topic: Borders, outlines and shadows- color -
border
Applies to topic: Borders, outlines and shadows- image -
border
Applies to topic: Borders, outlines and shadows- inline -
border
Applies to topic: Borders, outlines and shadows- radius -
border
Applies to topics: Borders, outlines and shadows Columns and tables- spacing -
border
Applies to topic: Borders, outlines and shadows- style -
border
Applies to topic: Borders, outlines and shadows- width -
box
Applies to topic: Borders, outlines and shadows- shadow -
box
Applies to topic: Sizes and margins- sizing
c
-
calc
Applies to topic: Functions( ) -
caption
Applies to topic: Columns and tables- side -
caret
Applies to topic: Forms- color - Cascading Principle Applies to topic: Basics
-
:checked
Applies to topics: Pseudo-classes Forms -
clamp
Applies to topic: Functions( ) - Class Selector Applies to topic: Selectors
-
clip
Applies to topic: Visibility -
clip
Applies to topic: Visibility- path -
color
Applies to topics: Functions Colors in web( ) -
color
Applies to topic: Text handling -
color
- scheme - Colors in the Web Applies to topic: Colors in web
-
column
Applies to topic: Columns and tables- count -
column
Applies to topic: Columns and tables- fill -
column
Applies to topic: Columns and tables- rule -
column
Applies to topic: Columns and tables- rule - color -
column
Applies to topic: Columns and tables- rule - style -
column
Applies to topic: Columns and tables- rule - width -
columns
Applies to topic: Columns and tables -
column
Applies to topic: Columns and tables- span -
column
Applies to topic: Columns and tables- width - Combined Selectors Applies to topic: Selectors
- Comments in CSS Applies to topics: Basics Basics
-
conic
Applies to topics: Functions Background- gradient ( ) - Connecting Styles Applies to topic: Basics
-
content
Applies to topic: Pseudo-elements -
counter
,( ) counters
Applies to topic: Counters( ) -
counter
Applies to topic: Counters- increment -
counter
Applies to topic: Counters- reset -
counter
Applies to topic: Counters- set - Counters in CSS Applies to topic: Counters
- CSS Animations Applies to topic: Animations
- CSS Rule Applies to topic: Basics
- CSS Transformation Functions Applies to topics: Functions Transformations
-
current
Applies to topic: Colors in webColor -
cursor
Applies to topic: Interface and interactions - Custom Properties Applies to topic: Custom properties
d
-
:default
Applies to topic: Pseudo-classes - Descendant Selector Applies to topic: Selectors
-
:disabled
,:enabled
Applies to topics: Pseudo-classes Forms -
display
Applies to topic: Basics
e
-
:empty
Applies to topic: Pseudo-classes - Enumerating Selectors Applies to topic: Selectors
f
-
fill
Applies to topic: SVG -
filter
Applies to topic: Image handling - Filter Functions Applies to topics: Functions Background Image handling
-
:
Applies to topic: Pseudo-elements: first - letter -
:
Applies to topic: Pseudo-elements: first - line -
flex
Applies to topic: Flexboxes -
flex
Applies to topic: Flexboxes- basis - Flexbox Guide Applies to topic: Flexboxes
-
flex
Applies to topic: Flexboxes- direction -
flex
Applies to topic: Flexboxes- flow -
flex
Applies to topic: Flexboxes- grow -
flex
Applies to topic: Flexboxes- shrink -
flex
Applies to topic: Flexboxes- wrap -
float
Applies to topic: Float -
:focus
Applies to topics: Pseudo-classes Forms -
:focus
Applies to topic: Pseudo-classes- visible -
:focus
Applies to topic: Pseudo-classes- within -
font
Applies to topic: Text handling -
font
Applies to topic: Text handling- display -
@font
Applies to topics: Directives Text handling- face -
font
Applies to topic: Text handling- family -
font
Applies to topic: Variable fonts- feature - settings -
font
Applies to topic: Variable fonts- kerning -
font
Applies to topic: Variable fonts- language - override -
font
Applies to topic: Variable fonts- optical - sizing -
font
Applies to topic: Text handling- size -
font
Applies to topic: Variable fonts- size - adjust -
font
Applies to topic: Text handling- smooth -
font
Applies to topic: Variable fonts- stretch -
font
Applies to topic: Text handling- style -
font
Applies to topic: Variable fonts- synthesis -
font
Applies to topic: Variable fonts- variant -
font
Applies to topic: Variable fonts- variant - alternates -
font
Applies to topic: Variable fonts- variant - caps -
font
Applies to topic: Variable fonts- variant - east - asian -
font
Applies to topic: Variable fonts- variant - ligatures -
font
Applies to topic: Variable fonts- variant - numeric -
font
Applies to topic: Variable fonts- variant - position -
font
Applies to topic: Variable fonts- variation - settings -
font
Applies to topic: Text handling- weight
g
-
gap
Applies to topic: Block alignment - Global Keywords Applies to topic: Global keywords
-
grid
Applies to topic: Grids -
grid
Applies to topic: Grids- area -
grid
,- auto - columns grid
Applies to topic: Grids- auto - rows -
grid
Applies to topic: Grids- auto - flow -
grid
,- column grid
Applies to topic: Grids- row -
grid
,- column - start grid
,- column - end grid
,- row - start grid
Applies to topic: Grids- row - end -
grid
Applies to topic: Grids- template -
grid
Applies to topic: Grids- template - areas -
grid
Applies to topic: Grids- template - columns -
grid
Applies to topic: Grids- template - rows
h
-
:has
Applies to topic: Pseudo-classes( ) -
height
Applies to topic: Sizes and margins -
:hover
Applies to topic: Pseudo-classes - How
flex
and- shrink flex
Really Work Applies to topic: Flexboxes- grow -
hyphens
Applies to topic: Text handling
i
-
image
Applies to topic: Image handling- rendering -
image
Applies to topics: Functions Background- set ( ) -
@import
Applies to topic: Directives - !important Applies to topic: !important
-
:indeterminate
Applies to topics: Pseudo-classes Forms - Inheritance Applies to topic: Basics
-
:in
,- range :out
Applies to topics: Pseudo-classes Forms- of - range -
inset
Applies to topic: Positioning -
:invalid
,:valid
Applies to topics: Pseudo-classes Forms -
:is
Applies to topic: Pseudo-classes( )
j
-
justify
Applies to topic: Block alignment- content -
justify
Applies to topic: Block alignment- items -
justify
Applies to topic: Block alignment- self
k
-
@keyframes
Applies to topics: Directives Animations
l
-
:lang
Applies to topic: Pseudo-classes -
@layer
Applies to topic: Directives -
letter
Applies to topic: Text handling- spacing -
light
- dark ( ) -
linear
Applies to topics: Functions Background- gradient ( ) -
line
Applies to topic: Text handling- height -
:link
Applies to topics: Links Pseudo-classes -
list
Applies to topic: Lists- style -
list
Applies to topic: Lists- style - image -
list
Applies to topic: Lists- style - position -
list
Applies to topic: Lists- style - type
m
-
margin
Applies to topic: Sizes and margins -
:
Applies to topics: Pseudo-elements Lists: marker -
max
Applies to topics: Functions Sizes and margins( ) -
@media
Applies to topic: Directives -
min
Applies to topics: Functions Sizes and margins( ) -
mix
Applies to topic: Image handling- blend - mode - Mobile-first vs Desktop-first
n
-
:not
Applies to topic: Pseudo-classes
o
-
object
Applies to topic: Image handling- fit -
object
Applies to topic: Image handling- position -
opacity
Applies to topic: Visibility -
:optional
Applies to topic: Pseudo-classes -
order
Applies to topic: Flexboxes -
outline
Applies to topic: Borders, outlines and shadows -
outline
Applies to topic: Borders, outlines and shadows- color -
outline
Applies to topic: Borders, outlines and shadows- offset -
outline
Applies to topic: Borders, outlines and shadows- style -
outline
Applies to topic: Borders, outlines and shadows- width -
overflow
Applies to topic: Overflow -
overflow
Applies to topic: Text handling- wrap
p
-
padding
Applies to topic: Sizes and margins -
perspective
Applies to topic: Transformations -
perspective
Applies to topic: Transformations- origin -
place
Applies to topic: Block alignment- content -
:
Applies to topics: Forms Pseudo-elements: placeholder -
:placeholder
Applies to topic: Pseudo-classes- shown -
place
Applies to topic: Block alignment- items -
place
Applies to topic: Block alignment- self -
pointer
Applies to topic: Interface and interactions- events -
position
Applies to topic: Positioning -
position
Applies to topic: Positioning: sticky -
prefers
- color - scheme - Pseudo-classes Applies to topic: Pseudo-classes
- Pseudo-classes of the child group Applies to topic: Pseudo-classes
- Pseudoclasses of the type group Applies to topic: Pseudo-classes
- Pseudo-elements Applies to topic: Pseudo-elements
q
-
quotes
Applies to topic: Text handling
r
-
radial
Applies to topics: Functions Background- gradient ( ) -
:read
Applies to topic: Forms- only -
:read
Applies to topic: Forms- write -
rem
,em
Applies to topic: Units of measurement -
repeating
Applies to topics: Functions Background- conic - gradient ( ) -
repeating
Applies to topics: Functions Background- linear - gradient ( ) -
repeating
Applies to topics: Functions Background- radial - gradient ( ) -
:required
Applies to topics: Forms Pseudo-classes Forms -
resize
Applies to topics: Forms Interface and interactions -
:root
Applies to topics: Pseudo-classes Custom properties -
row
,- gap column
Applies to topic: Block alignment- gap
s
-
scrollbar
Applies to topic: Interface and interactions- color -
scrollbar
Applies to topic: Interface and interactions- gutter -
scrollbar
Applies to topic: Interface and interactions- width -
scroll
Applies to topic: Interface and interactions- behavior -
scroll
Applies to topic: Interface and interactions- padding -
:
Applies to topic: Pseudo-elements: selection - Selector by Identifier Applies to topic: Selectors
- Specificity Applies to topic: Basics
- Stacking Context Applies to topics: Basics Positioning
-
stroke
Applies to topic: SVG -
@supports
Applies to topic: Directives -
sv
,lv
,dv
Applies to topic: Units of measurement
t
-
tab
Applies to topic: Text handling- size - Tag Selector Applies to topic: Selectors
-
:target
Applies to topic: Pseudo-classes -
text
Applies to topic: Text handling- align -
text
Applies to topic: Text handling- decoration -
text
Applies to topic: Text handling- decoration - color -
text
Applies to topic: Text handling- decoration - line -
text
Applies to topic: Text handling- decoration - skip - ink -
text
Applies to topic: Text handling- decoration - style -
text
Applies to topic: Text handling- decoration - thickness -
text
Applies to topic: Text handling- indent -
text
Applies to topic: Text handling- justify -
text
Applies to topic: Text handling- orientation -
text
Applies to topic: Text handling- overflow -
text
Applies to topic: Text handling- rendering -
text
Applies to topics: Text handling Borders, outlines and shadows- shadow -
text
Applies to topic: Text handling- size - adjust -
text
Applies to topic: Text handling- transform -
text
Applies to topic: Text handling- underline - offset -
text
Applies to topic: Text handling- underline - position -
top
,left
,right
,bottom
Applies to topic: Positioning -
touch
Applies to topic: Interface and interactions- action -
transform
Applies to topic: Transformations -
transform
Applies to topic: Transformations- box -
transform
Applies to topic: Transformations- origin -
transform
Applies to topic: Transformations- style -
transition
Applies to topic: Animations -
transition
Applies to topic: Animations- delay -
transition
Applies to topic: Animations- duration -
transition
Applies to topic: Animations- property -
transition
Applies to topic: Animations- timing - function
u
- Units of Measurement Applies to topic: Units of measurement
- Universal Selector Applies to topic: Selectors
-
url
Applies to topics: Functions Network( ) -
user
Applies to topic: Interface and interactions- select
v
-
var
Applies to topics: Semantics Functions Custom properties( ) - Vendor Prefixes Applies to topic: Basics
-
vertical
Applies to topic: Text handling- align -
visibility
Applies to topic: Visibility -
:visited
Applies to topic: Pseudo-classes -
vw
,vh
,vmin
,vmax
Applies to topic: Units of measurement
w
- WebGuide on grid Applies to topic: Grids
-
:where
Applies to topic: Pseudo-classes( ) -
white
Applies to topic: Text handling- space -
widows
Applies to topic: Print styles -
width
Applies to topic: Sizes and margins -
will
Applies to topics: Animations Transformations Visibility- change -
word
Applies to topic: Text handling- break -
word
Applies to topic: Text handling- spacing -
word
Applies to topic: Text handling- wrap -
writing
Applies to topic: Text handling- mode