backdrop-filter |
Defines a graphical effect to the area behind an element |
backface-visibility |
Defines whether or not the back face of an element should be visible when facing the user |
background |
A shorthand property for all the background-* properties |
background-attachment |
Sets whether a background image scrolls with the rest of the page, or is fixed |
background-blend-mode |
Specifies the blending mode of each background layer (color/image) |
background-clip |
Defines how far the background (color or image) should extend within an
element |
background-color |
Specifies the background color of an element |
background-image |
Specifies one or more background images for an element |
background-origin |
Specifies the origin position of a background image |
background-position |
Specifies the position of a background image |
background-position-x |
Specifies the position of a background image on x-axis |
background-position-y |
Specifies the position of a background image on y-axis |
background-repeat |
Sets if/how a background image will be repeated |
background-size |
Specifies the size of the background images |
block-size |
Specifies the size of an element in block direction |
border |
A shorthand property for border-width, border-style and border-color |
border-block |
A shorthand property for border-block-width, border-block-style and border-block-color |
border-block-color |
Sets the color of the borders at start and end in the block direction |
border-block-end |
A shorthand property for border-block-end-width, border-block-end-style and border-block-end-color |
border-block-end-color |
Sets the color of the border at the end in the block direction |
border-block-end-style |
Sets the style of the border at the end in the block direction |
border-block-end-width |
Sets the width of the border at the end in the block direction |
border-block-start |
A shorthand property for border-block-start-width, border-block-start-style and border-block-start-color |
border-block-start-color |
Sets the color of the border at the start in the block direction |
border-block-start-style |
Sets the style of the border at the start in the block direction |
border-block-start-width |
Sets the width of the border at the start in the block direction |
border-block-style |
Sets the style of the borders at start and end in the block direction |
border-block-width |
Sets the width of the borders at start and end in the block direction |
border-bottom |
A shorthand property for border-bottom-width, border-bottom-style
and border-bottom-color |
border-bottom-color |
Sets the color of the bottom border |
border-bottom-left-radius |
Defines the radius of the border of the bottom-left corner |
border-bottom-right-radius |
Defines the radius of the border of the bottom-right corner |
border-bottom-style |
Sets the style of the bottom border |
border-bottom-width |
Sets the width of the bottom border |
border-collapse |
Sets whether table borders should collapse into a single border or be separated |
border-color |
Sets the color of the four borders |
border-end-end-radius |
Sets the radius of the corner between the block-end and the inline-end
sides of the element |
border-end-start-radius |
Sets the radius of the corner between the block-end and the inline-start
sides of the element |
border-image |
A shorthand property for all the border-image-* properties |
border-image-outset |
Specifies the amount by which the border image area extends beyond the border box |
border-image-repeat |
Specifies whether the border image should be repeated, rounded or stretched |
border-image-slice |
Specifies how to slice the border image |
border-image-source |
Specifies the path to the image to be used as a border |
border-image-width |
Specifies the width of the border image |
border-inline |
A shorthand property for border-inline-width, border-inline-style and border-inline-color |
border-inline-color |
Sets the color of the borders at start and end in the inline direction |
border-inline-end |
A shorthand property for border-inline-end-width, border-inline-end-style and border-inline-end-color |
border-inline-end-color |
Sets the color of the border at the end in the inline direction |
border-inline-end-style |
Sets the style of the border at the end in the inline direction |
border-inline-end-width |
Sets the width of the border at the end in the inline direction |
border-inline-start |
A shorthand property for border-inline-start-width, border-inline-start-style and border-inline-start-color |
border-inline-start-color |
Sets the color of the border at the start in the inline direction |
border-inline-start-style |
Sets the style of the border at the start in the inline direction |
border-inline-start-width |
Sets the width of the border at the start in the inline direction |
border-inline-style |
Sets the style of the borders at start and end in the inline direction |
border-inline-width |
Sets the width of the borders at start and end in the inline direction |
border-left |
A shorthand property for all the border-left-* properties |
border-left-color |
Sets the color of the left border |
border-left-style |
Sets the style of the left border |
border-left-width |
Sets the width of the left border |
border-radius |
A shorthand property for the four border-*-radius properties |
border-right |
A shorthand property for all the border-right-* properties |
border-right-color |
Sets the color of the right border |
border-right-style |
Sets the style of the right border |
border-right-width |
Sets the width of the right border |
border-spacing |
Sets the distance between the borders of adjacent cells |
border-start-end-radius |
Sets the radius of the corner between the block-start and the inline-end
sides of the element |
border-start-start-radius |
Sets the radius of the corner between the block-start and the inline-start
sides of the element |
border-style |
Sets the style of the four borders |
border-top |
A shorthand property for border-top-width, border-top-style and
border-top-color |
border-top-color |
Sets the color of the top border |
border-top-left-radius |
Defines the radius of the border of the top-left corner |
border-top-right-radius |
Defines the radius of the border of the top-right corner |
border-top-style |
Sets the style of the top border |
border-top-width |
Sets the width of the top border |
border-width |
Sets the width of the four borders |
bottom |
Sets the elements position, from the bottom of its parent element |
box-decoration-break |
Sets the behavior of the background and border of an element at page-break, or, for in-line elements, at line-break. |
box-reflect |
The box-reflect property is used to create a reflection of an element. |
box-shadow |
Attaches one or more shadows to an element |
box-sizing |
Defines how the width and height of an element are calculated: should
they include padding and borders, or not |
break-after |
Specifies whether or not a page-, column-, or region-break should occur
after the specified element |
break-before |
Specifies whether or not a page-, column-, or region-break should occur
before the specified element |
break-inside |
Specifies whether or not a page-, column-, or region-break should occur
inside the specified element |
caption-side |
Specifies the placement of a table caption |
caret-color |
Specifies the color of the cursor (caret) in inputs, textareas, or any
element that is editable |
@charset |
Specifies the character encoding used in the style sheet |
clear |
Specifies what should happen with the element that is next to a floating
element |
clip |
Deprecated in favor of clip-path. Clips an absolutely positioned element |
clip-path |
Clips an element to a basic shape or to an SVG source |
color |
Sets the color of text |
color-scheme |
Indicates which operating system color scheme an element should render
with |
column-count |
Specifies the number of columns an element should be divided into |
column-fill |
Specifies how to fill columns, balanced or not |
column-gap |
Specifies the gap between the columns |
column-rule |
A shorthand property for all the column-rule-* properties |
column-rule-color |
Specifies the color of the rule between columns |
column-rule-style |
Specifies the style of the rule between columns |
column-rule-width |
Specifies the width of the rule between columns |
column-span |
Specifies how many columns an element should span across |
column-width |
Specifies the column width |
columns |
A shorthand property for column-width and column-count |
content |
Used with the :before and :after pseudo-elements, to insert generated content |
counter-increment |
Increases or decreases the value of one or more CSS counters |
counter-reset |
Creates or resets one or more CSS counters |
counter-set |
Creates or sets one or more CSS counters |
cursor |
Specifies the mouse cursor to be displayed when pointing over an element |
filter |
Defines effects (e.g. blurring or color shifting) on an element before the element is displayed |
flex |
A shorthand property for the flex-grow, flex-shrink, and the
flex-basis
properties |
flex-basis |
Specifies the initial length of a flexible item |
flex-direction |
Specifies the direction of the flexible items |
flex-flow |
A shorthand property for the flex-direction and the flex-wrap properties |
flex-grow |
Specifies how much the item will grow relative to the rest |
flex-shrink |
Specifies how the item will shrink relative to the rest |
flex-wrap |
Specifies whether the flexible items should wrap or not |
float |
Specifies whether an element should float to the left, right, or not at
all |
font |
A shorthand property for the font-style, font-variant, font-weight,
font-size/line-height, and the font-family properties |
@font-face |
A rule that allows websites to download and use fonts other than the "web-safe" fonts |
font-family |
Specifies the font family for text |
font-feature-settings |
Allows control over advanced typographic features in OpenType fonts |
@font-feature-values |
Allows authors to use a common name in font-variant-alternate for feature activated differently in OpenType |
font-kerning |
Controls the usage of the kerning information (how letters are spaced) |
font-language-override |
Controls the usage of language-specific glyphs in a typeface |
font-size |
Specifies the font size of text |
font-size-adjust |
Preserves the readability and size of text when fallback font occurs |
font-stretch |
Selects a normal, condensed, or expanded face from a font family |
font-style |
Specifies the font style for text |
font-synthesis |
Controls which missing typefaces (bold or italic) may be synthesized by the browser |
font-variant |
Specifies whether or not a text should be displayed in a small-caps font |
font-variant-alternates |
Controls the usage of alternate glyphs associated to alternative names defined in @font-feature-values |
font-variant-caps |
Controls the usage of alternate glyphs for capital letters |
font-variant-east-asian |
Controls the usage of alternate glyphs for East Asian scripts (e.g Japanese and Chinese) |
font-variant-ligatures |
Controls which ligatures and contextual forms are used in textual content of the elements it applies to |
font-variant-numeric |
Controls the usage of alternate glyphs for numbers, fractions, and ordinal markers |
font-variant-position |
Controls the usage of alternate glyphs of smaller size positioned as superscript or subscript regarding the baseline of the font |
font-weight |
Specifies the weight of a font |
gap |
A shorthand property for the row-gap and the column-gap properties |
grid |
A shorthand property for the grid-template-rows,
grid-template-columns, grid-template-areas, grid-auto-rows,
grid-auto-columns, and the grid-auto-flow properties |
grid-area |
Either specifies a name for the grid item, or this property is a shorthand property for the grid-row-start, grid-column-start, grid-row-end, and grid-column-end properties |
grid-auto-columns |
Specifies a default column size |
grid-auto-flow |
Specifies how auto-placed items are inserted in the grid |
grid-auto-rows |
Specifies a default row size |
grid-column |
A shorthand property for the grid-column-start and the grid-column-end properties |
grid-column-end |
Specifies where to end the grid item |
grid-column-start |
Specifies where to start the grid item |
grid-row |
A shorthand property for the grid-row-start and the grid-row-end properties |
grid-row-end |
Specifies where to end the grid item |
grid-row-start |
Specifies where to start the grid item |
grid-template |
A shorthand property for the grid-template-rows, grid-template-columns
and grid-areas properties |
grid-template-areas |
Specifies how to display columns and rows, using named grid items |
grid-template-columns |
Specifies the size of the columns, and how many columns in a grid layout |
grid-template-rows |
Specifies the size of the rows in a grid layout |
margin |
Sets all the margin properties in one declaration |
margin-block |
Specifies the margin in the block direction |
margin-block-end |
Specifies the margin at the end in the block direction |
margin-block-start |
Specifies the margin at the start in the block direction |
margin-bottom |
Sets the bottom margin of an element |
margin-inline |
Specifies the margin in the inline direction |
margin-inline-end |
Specifies the margin at the end in the inline direction |
margin-inline-start |
Specifies the margin at the start in the inline direction |
margin-left |
Sets the left margin of an element |
margin-right |
Sets the right margin of an element |
margin-top |
Sets the top margin of an element |
marker |
Points to a marker that will be drawn on all vertices of an element's
path (the first, middle, and last) |
marker-end |
Points to a marker that will be drawn on the last vertex of an element's
path |
marker-mid |
Points to a marker that will be drawn on all the middle vertices of an
element's path |
marker-start |
Points to a marker that will be drawn on the first vertex of an
element's path |
mask |
A shorthand property for mask-image, mask-mode,
mask-repeat, mask-position, mask-clip, mask-origin,
mask-size and mask-composite |
mask-clip |
Specifies which area is affected by a mask image |
mask-composite |
Specifies a compositing operation used on the current mask layer with
the mask layers below it |
mask-image |
Specifies an image to be used as a mask layer for an element |
mask-mode |
Specifies whether the mask layer image is treated as a luminance mask or
as an alpha mask |
mask-origin |
Specifies the origin position (the mask
position area) of a mask layer image |
mask-position |
Sets the starting position of a mask layer image (relative to the
mask position area) |
mask-repeat |
Specifies how the mask layer image is repeated |
mask-size |
Specifies the size of a mask layer image |
mask-type |
Specifies whether an SVG <mask> element is treated as a luminance
mask or as an alpha mask |
max-height |
Sets the maximum height of an element |
max-width |
Sets the maximum width of an element |
@media |
Sets the style rules for different media types/devices/sizes |
max-block-size |
Sets the maximum size of an element in the block direction |
max-inline-size |
Sets the maximum size of an element in the inline direction |
min-block-size |
Sets the minimum size of an element in the block direction |
min-inline-size |
Sets the minimum size of an element in the inline direction |
min-height |
Sets the minimum height of an element |
min-width |
Sets the minimum width of an element |
mix-blend-mode |
Specifies how an element's content should blend with its direct parent background |
object-fit |
Specifies how the contents of a replaced element should be fitted to the box established by its used height and width |
object-position |
Specifies the alignment of the replaced element inside its box |
offset |
A shorthand property for the offset-anchor, offset-distance,
offset-path, offset-position, and the offset-rotate
properties |
offset-anchor |
Specifies a point on an element that is fixed to the path it is animated along |
offset-distance |
Specifies the position along a path where an animated element is placed |
offset-path |
Specifies the path an element is animated along |
offset-position |
Specifies the initial position of an element along a path |
offset-rotate |
Specifies rotation of an element as it is animated along a path |
opacity |
Sets the opacity level for an element |
order |
Sets the order of the flexible item, relative to the rest |
orphans |
Sets the minimum number of lines that must be left at the bottom of a
page or column |
outline |
A shorthand property for the outline-width, outline-style, and
the outline-color properties |
outline-color |
Sets the color of an outline |
outline-offset |
Offsets an outline, and draws it beyond the border edge |
outline-style |
Sets the style of an outline |
outline-width |
Sets the width of an outline |
overflow
|
Specifies what happens if content overflows an element's box |
overflow-anchor
|
Specifies whether or not content in viewable area in a scrollable contianer should be pushed down when new content is loaded above |
overflow-wrap |
Specifies whether or not the browser can break lines with long words, if
they overflow the container |
overflow-x |
Specifies whether or not to clip the left/right edges of the content, if it overflows the element's content area |
overflow-y |
Specifies whether or not to clip the top/bottom edges of the content, if it overflows the element's content area |
overscroll-behavior |
Specifies whether to have scroll chaining or overscroll affordance in x- and y-directions |
overscroll-behavior-block |
Specifies whether to have scroll chaining or overscroll affordance in the block direction |
overscroll-behavior-inline |
Specifies whether to have scroll chaining or overscroll affordance in the inline direction |
overscroll-behavior-x |
Specifies whether to have scroll chaining or overscroll affordance in x-direction |
overscroll-behavior-y |
Specifies whether to have scroll chaining or overscroll affordance in y-directions |
padding |
A shorthand property for all the padding-* properties |
padding-block |
Specifies the padding in the block direction |
padding-block-end |
Specifies the padding at the end in the block direction |
padding-block-start |
Specifies the padding at the start in the block direction |
padding-bottom |
Sets the bottom padding of an element |
padding-inline |
Specifies the padding in the inline direction |
padding-inline-end |
Specifies the padding at the end in the inline direction |
padding-inline-start |
Specifies the padding at the start in the inline direction |
padding-left |
Sets the left padding of an element |
padding-right |
Sets the right padding of an element |
padding-top |
Sets the top padding of an element |
page-break-after |
Sets the page-break behavior after an element. Replaced by break-after property |
page-break-before |
Sets the page-break behavior before an element. Replaced by break-before property |
page-break-inside |
Sets the page-break behavior inside an element. Replaced by break-inside property |
paint-order |
Sets the order of how an SVG element or text is painted. |
perspective |
Gives a 3D-positioned element some perspective |
perspective-origin |
Defines at which position the user is looking at the 3D-positioned element |
place-content |
Specifies align-content and justify-content property values for flexbox and grid layouts |
place-items |
Specifies align-items and justify-items property values for grid layouts |
place-self |
Specifies align-self and justify-self property values for grid layouts |
pointer-events |
Defines whether or not an element reacts to pointer events |
position |
Specifies the type of positioning method used for an element (static, relative, absolute or fixed) |
@property |
Defines custom
CSS properties directly in the stylesheet without having to run any
JavaScript |
scale |
Specifies the size of an element by scaling up or down |
scroll-behavior |
Specifies whether to smoothly animate the scroll position in a scrollable box, instead of a straight jump |
scroll-margin |
Specifies the margin between the snap position and the container |
scroll-margin-block |
Specifies the margin between the snap position and the container in the block direction |
scroll-margin-block-end |
Specifies the end margin between the snap position and the container in the block direction |
scroll-margin-block-start |
Specifies the start margin between the snap position and the container in the block direction |
scroll-margin-bottom |
Specifies the margin between the snap position on the bottom side and the container |
scroll-margin-inline |
Specifies the margin between the snap position and the container in the inline direction |
scroll-margin-inline-end |
Specifies the end margin between the snap position and the container in the inline direction |
scroll-margin-inline-start |
Specifies the start margin between the snap position and the container in the inline direction |
scroll-margin-left |
Specifies the margin between the snap position on the left side and the container |
scroll-margin-right |
Specifies the margin between the snap position on the right side and the container |
scroll-margin-top |
Specifies the margin between the snap position on the top side and the container |
scroll-padding |
Specifies the distance from the container to the snap position on the child elements |
scroll-padding-block |
Specifies the distance in block direction from the container to the snap position on the child elements |
scroll-padding-block-end |
Specifies the distance in block direction from the end of the container to the snap position on the child elements |
scroll-padding-block-start |
Specifies the distance in block direction from the start of the container to the snap position on the child elements |
scroll-padding-bottom |
Specifies the distance from the bottom of the container to the snap position on the child elements |
scroll-padding-inline |
Specifies the distance in inline direction from the container to the snap position on the child elements |
scroll-padding-inline-end |
Specifies the distance in inline direction from the end of the container to the snap position on the child elements |
scroll-padding-inline-start |
Specifies the distance in inline direction from the start of the container to the snap position on the child elements |
scroll-padding-left |
Specifies the distance from the left side of the container to the snap position on the child elements |
scroll-padding-right |
Specifies the distance from the right side of the container to the snap position on the child elements |
scroll-padding-top |
Specifies the distance from the top of the container to the snap position on the child elements |
scroll-snap-align |
Specifies where to position elements when the user stops scrolling |
scroll-snap-stop |
Specifies scroll behaviour after fast swipe on trackpad or touch screen |
scroll-snap-type |
Specifies how snap behaviour should be when scrolling |
scrollbar-color |
Specifies the color of the scrollbar of an element |