List CSS
font-language-override
font-language-overrideThe font-language-override CSS property controls the use of language-specific glyphs in a typeface. /* Keyword value */ font-language-override: normal; /* <string> values ..
font-kerning
font-kerningThe font-kerning CSS property sets the use of the kerning information stored in a font. Kerning defines how letters are spaced. In well-kerned fonts, this feature makes character spacing m..
@font-feature-values
@font-feature-valuesThe @font-feature-values CSS at-rule lets you use a common name in the font-variant-alternates property for features activated differently in OpenType. This can help simplify your ..
font-feature-settings
font-feature-settingsThe font-feature-settings CSS property controls advanced typographic features in OpenType fonts.Syntax/* Use the default settings */ font-feature-settings: normal; /* Set values ..
font-family (@font-face)
font-familyThe font-family CSS descriptor allows authors to specify the font family for the font specified in an @font-face rule.Syntax/* <string> values */ font-family: "font family"; font-fami..
font-family
font-familyThe font-family CSS property specifies a prioritized list of one or more font family names and/or generic family names for the selected element. Values are separated by commas to indicate t..
@font-face
@font-faceThe @font-face CSS at-rule specifies a custom font with which to display text; the font can be loaded from either a remote server or a locally-installed font on the user's own computer.Synta..
font-display (@font-face)
font-displayThe font-display descriptor determines how a font face is displayed based on whether and when it is downloaded and ready to use.Syntax/* Keyword values */ font-display: auto; font-display:..
font
fontThe font CSS shorthand property sets all the different properties of an element's font. Alternatively, it sets an element's font to a system font. As with any shorthand property, any individual va..
:focus-within
:focus-withinThe :focus-within CSS pseudo-class matches an element if the element or any of its descendants are focused. In other words, it represents an element that is itself matched by the :focus p..
:focus-visible
:focus-visibleThe :focus-visible pseudo-class applies while an element matches the :focus pseudo-class and the UA (User Agent) determines via heuristics that the focus should be made evident on the el..
:focus
:focusThe :focus CSS pseudo-class represents an element (such as a form input) that has received focus. It is generally triggered when the user clicks or taps on an element or selects it with the keyb..
float
floatThe float CSS property places an element on the left or right side of its container, allowing text and inline elements to wrap around it. The element is removed from the normal flow of the page, ..
flex_value#fr
<flex>The <flex> CSS data type denotes a flexible length within a grid container. It is used in grid-template-columns, grid-template-rows and other related properties.SyntaxThe <flex>..
flex-wrap
flex-wrapThe flex-wrap CSS property sets whether flex items are forced onto one line or can wrap onto multiple lines. If wrapping is allowed, it sets the direction that lines are stacked. See Using CS..
flex-shrink
flex-shrinkThe flex-shrink CSS property sets the flex shrink factor of a flex item. If the size of all flex items is larger than the flex container, items shrink to fit according to flex-shrink. In us..
flex-grow
flex-growThe flex-grow CSS property sets the flex grow factor of a flex item's main size.Syntax/* <number> values */ flex-grow: 3; flex-grow: 0.6; /* Global values */ flex-grow: inherit; flex-g..
flex-flow
flex-flowThe flex-flow CSS shorthand property specifies the direction of a flex container, as well as its wrapping behavior.Constituent propertiesThis property is a shorthand for the following CSS pro..
flex-direction
flex-directionThe flex-direction CSS property sets how flex items are placed in the flex container defining the main axis and the direction (normal or reversed). Note that the values row and row-rever..
flex-basis
flex-basisThe flex-basis CSS property sets the initial main size of a flex item. It sets the size of the content box unless otherwise set with box-sizing. In this example the flex-grow and flex-shrink..
flex
flexThe flex CSS shorthand property sets how a flex item will grow or shrink to fit the space available in its flex container.Constituent propertiesThis property is a shorthand for the following CSS p..
<flex>
<flex>The <flex> CSS data type denotes a flexible length within a grid container. It is used in grid-template-columns, grid-template-rows and other related properties.SyntaxThe <flex>..
fit-content()
fit-contentThe fit-content behaves as fit-content(stretch). In practice this means that the box will use the available space, but never more than max-content. When used as laid out box size for width,..
:first-of-type
:first-of-typeThe :first-of-type CSS pseudo-class represents the first element of its type among a group of sibling elements. /* Selects any <p> that is the first element of its type among it..
::first-line (:first-line)
::first-line (:first-line)The ::first-line CSS pseudo-element applies styles to the first line of a block-level element. /* Selects the first line of a <p> */ p::first-line { color: red; } Th..
::first-letter (:first-letter)
::first-letter (:first-letter)The ::first-letter CSS pseudo-element applies styles to the first letter of the first line of a block-level element, but only when not preceded by other content (such as ..
:first-child
:first-childThe :first-child CSS pseudo-class represents the first element among a group of sibling elements. /* Selects any <p> that is the first element among its siblings */ p:first-child ..
:first
:firstThe :first CSS pseudo-class, used with the @page at-rule, represents the first page of a printed document. (See :first-child for general first element of a node.) /* Selects the first page when ..
<filter-function>
<filter-function>The <filter-function> CSS data type represents a graphical effect that can change the appearance of an input image. It is used in the filter and backdrop-filter properties..
filter
filterThe filter CSS property applies graphical effects like blur or color shift to an element. Filters are commonly used to adjust the rendering of images, backgrounds, and borders. Included in the C..
fallback (@counter-style)
fallbackThe fallback descriptor can be used to specify a counter style to fall back to if the current counter style cannot create a marker representation for a particular counter value.Syntax/* Keywor..
length#ex
<length>The <length> CSS data type represents a distance value. Lengths can be used in numerous CSS properties, such as width, height, margin, padding, border-width, font-size, and text-sh..
length#em
<length>The <length> CSS data type represents a distance value. Lengths can be used in numerous CSS properties, such as width, height, margin, padding, border-width, font-size, and text-sh..
env()
env()The env() CSS function can be used to insert the value of a user agent-defined environment variable into your CSS, in a similar fashion to the var() function and custom properties. The difference..
:enabled
:enabledThe :enabled CSS pseudo-class represents any enabled element. An element is enabled if it can be activated (selected, clicked on, typed into, etc.) or accept focus. The element also has a disa..
empty-cells
empty-cellsThe empty-cells CSS property sets whether borders and backgrounds appear around <table> cells that have no visible content. This property has an effect only when the border-collapse p..
:empty
:emptyThe :empty CSS pseudo-class represents any element that has no children. Children can be either element nodes or text (including whitespace). Comments, processing instructions, and CSS content d..
ellipse()
<basic-shape>The <basic-shape> CSS data type represents a shape used in the clip-path, shape-outside, and offset-path properties.SyntaxThe <basic-shape> data type is defined with one..
element()
element()Experimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production. The element() CSS function defines an <image> value gene..
resolution#dppx
<resolution>The <resolution> CSS data type, used for describing resolutions in media queries, denotes the pixel density of an output device, i.e., its resolution. On screens, the units are..
resolution#dpi
<resolution>The <resolution> CSS data type, used for describing resolutions in media queries, denotes the pixel density of an output device, i.e., its resolution. On screens, the units are..
resolution#dpcm
<resolution>The <resolution> CSS data type, used for describing resolutions in media queries, denotes the pixel density of an output device, i.e., its resolution. On screens, the units are..
drop-shadow()
drop-shadow()The drop-shadow() CSS function applies a drop shadow effect to the input image. Its result is a <filter-function>. A drop shadow is effectively a blurred, offset version of the inpu..
<display-outside>
<display-outside>The <display-outside> keywords specify the element's outer display type, which is essentially its role in flow layout. These keywords are used as values of the display pro..
<display-listitem>
<display-listitem>The list-item keyword causes the element to generate a ::marker pseudo-element with the content specified by its list-style properties (for example a bullet point) together wit..
<display-legacy>
<display-legacy>CSS 2 used a single-keyword syntax for the display property, requiring separate keywords for block-level and inline-level variants of the same layout mode. This page details thos..
<display-internal>
<display-internal>Some layout models such as table and ruby have a complex internal structure, with several different roles that their children and descendants can fill. This page defines those ..
<display-inside>
<display-inside>These keywords specify the element's inner display type, which defines the type of formatting context that lays out its contents (assuming it is a non-replaced element). These ke..
<display-box>
<display-box>These keywords define whether an element generates display boxes at all.SyntaxValid <display-box> values: contents These elements don't produce a specific box by the..
display
displayThe display CSS property sets whether an element is treated as a block or inline element and the layout used for its children, such as flow layout, grid or flex. Formally, the display property ..