Search
Search CSS
word-spacing
word-spacingThe word-spacing CSS property sets the length of space between words and between tags.Syntax/* Keyword value */ word-spacing: normal; /* <length> values */ word-spacing: 3px; word-s..
word-break
word-breakThe word-break CSS property sets whether line breaks appear wherever the text would otherwise overflow its content box.Syntax/* Keyword values */ word-break: normal; word-break: break-all; w..
will-change
will-changeThe will-change CSS property hints to browsers how an element is expected to change. Browsers may set up optimizations before an element is actually changed. These kinds of optimizations ca..
width
widthThe width CSS property sets an element's width. By default, it sets the width of the content area, but if box-sizing is set to border-box, it sets the width of the border area. The min-width and ..
white-space
white-spaceThe white-space CSS property sets how white space inside an element is handled. The property specifies two things: Whether and how white space is collapsed. Whether lines may wrap at s..
:where
:where()The :where() CSS pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list. /* Selects any paragraph inside..
vertical-align
vertical-alignThe vertical-align CSS property sets vertical alignment of an inline, inline-block or table-cell box. The vertical-align property can be used in two contexts: To vertically align an i..
length#vw
<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#vmin
<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#vmax
<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#vh
<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..
url()
url()The url() CSS function is used to include a file. The parameter is an absolute URL, a relative URL, a blob URL, or a data URL. The url() function can be passed as a parameter of another CSS funct..
<url>
url()The url() CSS function is used to include a file. The parameter is an absolute URL, a relative URL, a blob URL, or a data URL. The url() function can be passed as a parameter of another CSS funct..
unicode-range (@font-face)
unicode-rangeThe unicode-range CSS descriptor sets the specific range of characters to be used from a font defined by @font-face and made available for use on the current page. If the page doesn't use..
translate
translateThe translate CSS property allows you to specify translation transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves h..
transition-timing-function
transition-timing-functionThe transition-timing-function CSS property sets how intermediate values are calculated for CSS properties being affected by a transition effect. This, in essence, lets you e..
transition-property
transition-propertyThe transition-property CSS property sets the CSS properties to which a transition effect should be applied. Note: The set of properties that can be animated is subject to change..
transition-duration
transition-durationThe transition-duration CSS property sets the length of time a transition animation should take to complete. By default, the value is 0s, meaning that no animation will occur. You m..
transition-delay
transition-delayThe transition-delay CSS property specifies the duration to wait before starting a property's transition effect when its value changes. The delay may be zero, positive, or negative: ..
transition
transitionThe transition CSS property is a shorthand property for transition-property, transition-duration, transition-timing-function, and transition-delay. Transitions enable you to define the trans..
transform-style
transform-styleThe transform-style CSS property sets whether children of an element are positioned in the 3D space or are flattened in the plane of the element. If flattened, the element's children wi..
transform-origin
transform-originThe transform-origin CSS property sets the origin for an element's transformations. The transform origin is the point around which a transformation is applied. For example, the transfo..
<transform-function>
<transform-function>The <transform-function> CSS data type represents a transformation that affects an element's appearance. Transformation functions can rotate, resize, distort, or move a..
transform
transform The transform CSS property lets you rotate, scale, skew, or translate an element. It modifies the coordinate space of the CSS visual formatting model. If the property has a value dif..
@top-center
@pageThe @page CSS at-rule is used to modify some CSS properties when printing a document.Syntax@page { margin: 1cm; } @page :first { margin: 2cm; } Descriptors size Specifies the target..
text-underline-position
text-underline-positionThe text-underline-position CSS property specifies the position of the underline which is set using the text-decoration property's underline value.Syntax/* Single keyword */ tex..
text-underline-offset
text-underline-offsetThe text-underline-offset CSS property sets the offset distance of an underline text decoration line (applied using text-decoration) from its original position. text-underline-off..
text-transform
text-transformThe text-transform CSS property specifies how to capitalize an element's text. It can be used to make text appear in all-uppercase or all-lowercase, or with each word capitalized. It als..
text-size-adjust
text-size-adjustExperimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production. The text-size-adjust CSS property controls the text inf..
text-shadow
text-shadowThe text-shadow CSS property adds shadows to text. It accepts a comma-separated list of shadows to be applied to the text and any of its decorations. Each shadow is described by some combin..
text-rendering
text-renderingThe text-rendering CSS property provides information to the rendering engine about what to optimize for when rendering text. The browser makes trade-offs among speed, legibility, and geo..
text-justify
text-justifyThe text-justify CSS property sets what type of justification should be applied to text when text-align: justify; is set on an element.Syntaxtext-justify: none; text-justify: auto; text-ju..
text-indent
text-indentThe text-indent CSS property sets the length of empty space (indentation) that is put before lines of text in a block. Horizontal spacing is with respect to the left (or right, for right-to..
text-emphasis-color
text-emphasis-colorThe text-emphasis-color CSS property sets the color of emphasis marks. This value can also be set using the text-emphasis shorthand. /* Initial value */ text-emphasis-color: current..
text-emphasis
text-emphasisThe text-emphasis CSS property applies emphasis marks to text (except spaces and control characters). It is a shorthand for text-emphasis-style and text-emphasis-color. The text-emphasis ..
text-decoration-thickness
text-decoration-thicknessThe text-decoration-thickness CSS property sets the stroke thickness of the decoration line that is used on text in an element, such as a line-through, underline, or overline...
text-decoration-skip-ink
text-decoration-skip-inkThe text-decoration-skip-ink CSS property specifies how overlines and underlines are drawn when they pass over glyph ascenders and descenders. text-decoration-skip-ink is not p..
text-decoration-skip
text-decoration-skipThe text-decoration-skip CSS property sets what parts of an element's content any text decoration affecting the element must skip over. It controls all text decoration lines drawn ..
text-decoration-color
text-decoration-colorThe text-decoration-color CSS property sets the color of decorations added to text by text-decoration-line. The color applies to decorations, such as underlines, overlines, strike..
text-decoration
text-decorationThe text-decoration shorthand CSS property sets the appearance of decorative lines on text. It is a shorthand for text-decoration-line, text-decoration-color, text-decoration-style, and..
text-combine-upright
text-combine-uprightThe text-combine-upright CSS property sets the combination of characters into the space of a single character. If the combined text is wider than 1em, the user agent must fit the c..
text-align-last
text-align-lastThe text-align-last CSS property sets how the last line of a block or a line, right before a forced line break, is aligned.Syntax/* Keyword values */ text-align-last: auto; text-align-l..
:target-within
:target-withinExperimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production. The :target-within CSS pseudo-class represents an element..
:target
:targetThe :target CSS pseudo-class represents a unique element (the target element) with an id matching the URL's fragment. /* Selects an element with an ID matching the current URL's fragment */ :ta..
system (@counter-style)
systemThe system descriptor specifies the algorithm to be used for converting the integer value of a counter to a string representation. It is used in a @counter-style to define the behavior of the de..
symbols (@counter-style)
symbolsThe symbols CSS descriptor is used to specify the symbols that the specified counter system will use to construct counter representations.SyntaxThe symbols descriptor is specified as one or mor..
swash()
font-variant-alternatesThe font-variant-alternates CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in @font-feature-values. /..
@swash
@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 ..
@supports
@supportsThe @supports CSS at-rule lets you specify declarations that depend on a browser's support for one or more specific CSS features. This is called a feature query. The rule may be placed at the..
suffix (@counter-style)
suffixThe suffix descriptor of the@counter-style rule specifies content that will be appended to the marker representation.Syntax/* <symbol> values */ suffix: ""; suffix: ") "; suffix: url(bulle..
stylistic()
font-variant-alternatesThe font-variant-alternates CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in @font-feature-values. /..
@stylistic
@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 ..
styleset()
font-variant-alternatesThe font-variant-alternates CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in @font-feature-values. /..
@styleset
@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 ..
<string>
<string>The <string> CSS data type represents a sequence of characters. Strings are used in numerous CSS properties, such as content, font-family, and quotes.SyntaxThe <string> data ..
src (@font-face)
srcThe src CSS descriptor of the @font-face rule specifies the resource containing font data. It is required for the @font-face rule to be valid.Syntax/* <url> values */ src: url(https://someweb..
speak-as (@counter-style)
speak-asThe speak-as descriptor specifies how a counter symbol constructed with a given @counter-style will be represented in the spoken form. For example, an author can specify a counter symbol to be..
::slotted
::slotted()The ::slotted() CSS pseudo-element represents any element that has been placed into a slot inside an HTML template (see Using templates and slots for more information). This only works when..
size-adjust (@font-face)
size-adjustThe size-adjust CSS descriptor defines a multiplier for glyph outlines and metrics associated with this font. This makes it easier to harmonize the designs of various fonts when rendered at..
size (@page)
sizeExperimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production. The size CSS at-rule descriptor, used with the @page at-rule, defin..
shape-outside
shape-outsideThe shape-outside CSS property defines a shape—which may be non-rectangular—around which adjacent inline content should wrap. By default, inline content wraps around its margin box; s..
shape-margin
shape-marginThe shape-margin CSS property sets a margin for a CSS shape created using shape-outside. The margin lets you adjust the distance between the edges of the shape (the float element) and the ..
shape-image-threshold
shape-image-thresholdThe shape-image-threshold CSS property sets the alpha channel threshold used to extract the shape using an image as the value for shape-outside. Any pixels whose alpha component's..
::selection
::selectionThe ::selection CSS pseudo-element applies styles to the part of a document that has been highlighted by the user (such as clicking and dragging the mouse across text). ::selection { back..
scrollbar-color
scrollbar-colorThe scrollbar-color CSS property sets the color of the scrollbar track and thumb. The track refers to the background of the scrollbar, which is generally fixed regardless of the scrolli..
scroll-snap-type
scroll-snap-typeThe scroll-snap-type CSS property sets how strictly snap points are enforced on the scroll container in case there is one. Specifying any precise animations or physics used to enforce ..
scroll-snap-stop
scroll-snap-stopThe scroll-snap-stop CSS property defines whether the scroll container is allowed to "pass over" possible snap positions. /* Keyword values */ scroll-snap-stop: normal; scroll-snap-sto..
scroll-padding-top
scroll-padding-topThe scroll-padding-top property defines offsets for the top of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the us..
scroll-padding-right
scroll-padding-rightThe scroll-padding-right property defines offsets for the right of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of ..
scroll-padding-left
scroll-padding-leftThe scroll-padding-left property defines offsets for the left of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the..
scroll-padding-inline-start
scroll-padding-inline-startThe scroll-padding-inline-start property defines offsets for the start edge in the inline dimension of the optimal viewing region of the scrollport: the region used as the t..
scroll-padding-inline-end
scroll-padding-inline-endThe scroll-padding-inline-end property defines offsets for the end edge in the inline dimension of the optimal viewing region of the scrollport: the region used as the target ..
scroll-padding-inline
scroll-padding-inlineThe scroll-padding-inline shorthand property sets the scroll padding of an element in the inline dimension. The scroll-padding properties define offsets for the optimal viewing re..
scroll-padding-bottom
scroll-padding-bottomThe scroll-padding-bottom property defines offsets for the bottom of the optimal viewing region of the scrollport: the region used as the target region for placing things in view ..
scroll-padding-block-start
scroll-padding-block-startThe scroll-padding-block-start property defines offsets for the start edge in the block dimension of the optimal viewing region of the scrollport: the region used as the targ..
scroll-padding-block-end
scroll-padding-block-endThe scroll-padding-block-end property defines offsets for the end edge in the block dimension of the optimal viewing region of the scrollport: the region used as the target reg..
scroll-padding-block
scroll-padding-blockThe scroll-padding-block shorthand property sets the scroll padding of an element in the block dimension. The scroll-padding properties define offsets for the optimal viewing regio..
scroll-padding
scroll-paddingThe scroll-padding shorthand property sets scroll padding on all sides of an element at once, much like the padding property does for padding on an element. The scroll-padding-* properti..
scroll-margin-inline-start
scroll-margin-inline-startThe scroll-margin-inline-start property defines the margin of the scroll snap area at the start of the inline dimension that is used for snapping this box to the snapport. Th..
scroll-margin-inline-end
scroll-margin-inline-endThe scroll-margin-inline-end property defines the margin of the scroll snap area at the end of the inline dimension that is used for snapping this box to the snapport. The scro..
scroll-margin-inline
scroll-margin-inlineThe scroll-margin-inline shorthand property sets the scroll margins of an element in the inline dimension.Constituent propertiesThis property is a shorthand for the following CSS p..
scroll-margin
scroll-marginThe scroll-margin shorthand property sets all of the scroll margins of an element at once, assigning values much like the margin property does for margins of an element.Constituent proper..
scroll-behavior
scroll-behaviorThe scroll-behavior CSS property sets the behavior for a scrolling box when scrolling is triggered by the navigation or CSSOM scrolling APIs. Note that any other scrolls, such as those ..
scale
scaleThe scale CSS property allows you to specify scale transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remem..
row-gap
row-gap (grid-row-gap)The row-gap CSS property sets the size of the gap (gutter) between an element's grid rows.Syntax/* <length> values */ row-gap: 20px; row-gap: 1em; row-gap: 3vmin; row-gap: ..
rotate
rotateThe rotate CSS property allows you to specify rotation transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to ..
@right-bottom
@pageThe @page CSS at-rule is used to modify some CSS properties when printing a document.Syntax@page { margin: 1cm; } @page :first { margin: 2cm; } Descriptors size Specifies the target..
revert
revertThe revert CSS keyword reverts the cascaded value of the property from its current value to the value the property would have had if no changes had been made by the current style origin to the c..
:read-write
:read-writeThe :read-write CSS pseudo-class represents an element (such as input or textarea) that is editable by the user. input:read-write, textarea:read-write { background-color: #bbf; } p:read-..
:read-only
:read-onlyThe :read-only CSS pseudo-class represents an element (such as input or textarea) that is not editable by the user. input:read-only, textarea:read-only { background-color: #ccc; } p:read-..
length#rem
<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#Q
<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..
prefix (@counter-style)
prefixThe prefix descriptor of the @counter-style rule specifies content that will be prepended to the marker representation. If not specified, the default value will be "" (an empty string).Syntax/* ..
position
positionThe position CSS property sets how an element is positioned in a document. The top, right, bottom, and left properties determine the final location of positioned elements.Syntaxposition: stati..
:placeholder-shown
:placeholder-shownThe :placeholder-shown CSS pseudo-class represents any <input> or <textarea> element that is currently displaying placeholder text. /* Selects any element with an active ..
::placeholder
::placeholderThe ::placeholder CSS pseudo-element represents the placeholder text in an <input> or <textarea> element. ::placeholder { color: blue; font-size: 1.5em; } Only the subset..
place-self
place-selfThe place-self CSS shorthand property allows you to align an individual item in both the block and inline directions at once (i.e. the align-self and justify-self properties) in a relevant l..
place-items
place-itemsThe CSS place-items shorthand property allows you to align items along both the block and inline directions at once (i.e. the align-items and justify-items properties) in a relevant layout ..
place-content
place-contentThe place-content CSS shorthand property allows you to align content along both the block and inline directions at once (i.e. the align-content and justify-content properties) in a releva..
perspective-origin
perspective-originThe perspective-origin CSS property determines the position at which the viewer is looking. It is used as the vanishing point by the perspective property. The perspective-origin and ..
perspective()
perspective() The perspective() CSS function defines a transformation that sets the distance between the user and the z=0 plane, the perspective from which the viewer would be if the 2-dimensional..
<percentage>
<percentage>The <percentage> CSS data type represents a percentage value. It is often used to define a size as relative to an element's parent object. Numerous properties can use percentag..
paint-order
paint-orderThe paint-order CSS property lets you control the order in which the fill and stroke (and painting markers) of text content and shapes are drawn.Syntax/* Normal */ paint-order: normal; /* ..
@page
@pageThe @page CSS at-rule is used to modify some CSS properties when printing a document.Syntax@page { margin: 1cm; } @page :first { margin: 2cm; } Descriptors size Specifies the target..
pad (@counter-style)
padThe pad descriptor can be used with custom counter style definitions when you need the marker representations to have a minimum length.Syntaxpad: 3 "0"; Values <integer> && <symb..
length#px
<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#pt
<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#pc
<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..
Pseudo-elements
Pseudo-elementsA CSS pseudo-element is a keyword added to a selector that lets you style a specific part of the selected element(s). For example, ::first-line can be used to change the font of the fir..
overflow-clip-margin
overflow-clip-marginThe overflow-clip-margin CSS property determines how far outside its bounds an element with overflow: clip may be painted before being clipped.Syntaxoverflow-clip-margin: 20px; ove..
overflow
overflowThe overflow CSS shorthand property sets the desired behavior for an element's overflow — i.e. when an element's content is too big to fit in its block formatting context — in both directi..
outline-width
outline-widthThe CSS outline-width property sets the thickness of an element's outline. An outline is a line that is drawn around an element, outside the border. It is often more convenient to use the..
outline-color
outline-colorThe outline-color CSS property sets the color of an element's outline.Syntax/* <color> values */ outline-color: #f92525; outline-color: rgb(30,222,121); outline-color: blue; /* Key..
ornaments()
font-variant-alternatesThe font-variant-alternates CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in @font-feature-values. /..
@ornaments
@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 ..
opacity
opacityThe opacity CSS property sets the opacity of an element. Opacity is the degree to which content behind an element is hidden, and is the opposite of transparency.Syntaxopacity: 0.9 opacity: 90% ..
offset-position
offset-positionExperimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production. The offset-position CSS property defines the initial pos..
offset-path
offset-pathThe offset-path CSS property specifies a motion path for an element to follow and defines the element's positioning within the parent container or SVG coordinate system.Syntax/* Default */ ..
offset-distance
offset-distanceThe offset-distance CSS property specifies a position along an offset-path for an element to be placed.Syntax/* Default value */ offset-distance: 0; /* the middle of the offset-path */..
offset-anchor
offset-anchorThe offset-anchor CSS property specifies the point inside the box of an element travelling along an offset-path that is actually moving along the path.Syntax/* Keyword values */ offset-an..
object-position
object-positionThe object-position CSS property specifies the alignment of the selected replaced element's contents within the element's box. Areas of the box which aren't covered by the replaced elem..
object-fit
object-fitThe object-fit CSS property sets how the content of a replaced element, such as an <img> or <video>, should be resized to fit its container. You can alter the alignment of the re..
:nth-of-type
:nth-of-type()The :nth-of-type() CSS pseudo-class matches elements based on their position among siblings of the same type (tag name). /* Selects every fourth <p> element among any group of s..
:nth-last-of-type
:nth-last-of-type()The :nth-last-of-type() CSS pseudo-class matches elements based on their position among siblings of the same type (tag name), counting from the end. /* Selects every fourth <p>..
:nth-last-child
:nth-last-child()The :nth-last-child() CSS pseudo-class matches elements based on their position among a group of siblings, counting from the end. /* Selects every fourth element among any group of..
:nth-child
:nth-child()The :nth-child() CSS pseudo-class matches elements based on their position among a group of siblings. /* Selects the second <li> element in a list */ li:nth-child(2) { color: lime;..
:not
:not()The :not() CSS pseudo-class represents elements that do not match a list of selectors. Since it prevents specific items from being selected, it is known as the negation pseudo-class. /* Selects ..
negative (@counter-style)
negativeWhen defining custom counter styles, the negative descriptor lets you alter the representations of negative counter values, by providing a way to specify symbols to be appended or prepended to..
@namespace
@namespace@namespace is an at-rule that defines XML namespaces to be used in a CSS style sheet.Syntax/* Default namespace */ @namespace url(XML-namespace-URL); @namespace "XML-namespace-URL"; /* Pref..
mix-blend-mode
mix-blend-modeThe mix-blend-mode CSS property sets how an element's content should blend with the content of the element's parent and the element's background.Syntax/* Keyword values */ mix-blend-mode..
min-width
min-widthThe min-width CSS property sets the minimum width of an element. It prevents the used value of the width property from becoming smaller than the value specified for min-width. The element's w..
min-height
min-heightThe min-height CSS property sets the minimum height of an element. It prevents the used value of the height property from becoming smaller than the value specified for min-height. The elemen..
min()
min()The min() CSS function lets you set the smallest (most negative) value from a list of comma-separated expressions as the value of a CSS property value. The min() function can be used anywhere a &..
@media
@mediaThe @media CSS at-rule can be used to apply part of a style sheet based on the result of one or more media queries. With it, you specify a media query and a block of CSS to apply to the document..
max-width
max-widthThe max-width CSS property sets the maximum width of an element. It prevents the used value of the width property from becoming larger than the value specified by max-width. max-width overrid..
max-height
max-heightThe max-height CSS property sets the maximum height of an element. It prevents the used value of the height property from becoming larger than the value specified for max-height. max-height ..
max-block-size
max-block-sizeThe max-block-size CSS property specifies the maximum size of an element in the direction opposite that of the writing direction as specified by writing-mode. That is, if the writing dir..
max()
max()The max() CSS function lets you set the largest (most positive) value from a list of comma-separated expressions as the value of a CSS property value. The max() function can be used anywhere a &l..
matrix3d()
matrix3d() The matrix3d() CSS function defines a 3D transformation as a 4x4 homogeneous matrix. Its result is a <transform-function> data type. SyntaxThe matrix3d() function is specified wit..
mask-size
mask-sizeThe mask-size CSS property specifies the sizes of the mask images. The size of the image can be fully or partially constrained in order to preserve its intrinsic ratio. /* Keywords syntax */ ..
mask-repeat
mask-repeatThe mask-repeat CSS property sets how mask images are repeated. A mask image can be repeated along the horizontal axis, the vertical axis, both axes, or not repeated at all. /* One-value sy..
mask-position
mask-positionThe mask-position CSS property sets the initial position, relative to the mask position layer set by mask-origin, for each defined mask image. /* Keyword values */ mask-position: top; mas..
mask-origin
mask-originThe mask-origin CSS property sets the origin of a mask. /* Keyword values */ mask-origin: content-box; mask-origin: padding-box; mask-origin: border-box; mask-origin: margin-box; mask-origi..
mask-mode
mask-modeThe mask-mode CSS property sets whether the mask reference defined by mask-image is treated as a luminance or alpha mask. /* Keyword values */ mask-mode: alpha; mask-mode: luminance; mask-mod..
mask-image
mask-image The mask-image CSS property sets the image that is used as mask layer for an element. By default this means the alpha channel of the mask image will be multiplied with the alpha channel..
mask-composite
mask-compositeThe mask-composite CSS property represents a compositing operation used on the current mask layer with the mask layers below it. /* Keyword values */ mask-composite: add; mask-composite:..
mask-clip
mask-clipThe mask-clip CSS property determines the area which is affected by a mask. The painted content of an element must be restricted to this area. /* <geometry-box> values */ mask-clip: con..
mask-border-width
mask-border-widthThe mask-border-width CSS property sets the width of an element's mask border.Syntax/* Keyword value */ mask-border-width: auto; /* <length> value */ mask-border-width: 1rem; ..
mask-border-source
mask-border-sourceThe mask-border-source CSS property sets the source image used to create an element's mask border. The mask-border-slice property is used to divide the source image into regions, whi..
mask-border-slice
mask-border-sliceThe mask-border-slice CSS property divides the image set by mask-border-source into regions. These regions are used to form the components of an element's mask border.Syntax/* All sid..
mask
maskThe mask CSS shorthand property hides an element (partially or fully) by masking or clipping the image at specific points. Note: As well as the properties listed below, the mask shorthand also ..
::marker
::markerThe ::marker CSS pseudo-element selects the marker box of a list item, which typically contains a bullet or number. It works on any element or pseudo-element set to display: list-item, such as..
length#mm
<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..
local()
srcThe src CSS descriptor of the @font-face rule specifies the resource containing font data. It is required for the @font-face rule to be valid.Syntax/* <url> values */ src: url(https://someweb..
list-style-type
list-style-typeThe list-style-type CSS property sets the marker (such as a disc, character, or custom counter style) of a list item element. The color of the marker will be the same as the computed co..
list-style-image
list-style-imageThe list-style-image CSS property sets an image to be used as the list item marker. It is often more convenient to use the shorthand list-style. Note: This property is applied to li..
:link
:linkThe :link CSS pseudo-class represents an element that has not yet been visited. It matches every unvisited <a> or <area> element that has an href attribute. /* Selects any <a> t..
line-height-step
line-height-stepExperimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production. The line-height-step CSS property sets the step unit fo..
line-height
line-heightThe line-height CSS property sets the height of a line box. It's commonly used to set the distance between lines of text. On block-level elements, it specifies the minimum height of line bo..
line-gap-override (@font-face)
line-gap-overrideThe line-gap-override CSS descriptor defines the line-gap metric for the font. The line-gap metric is the font recommended line-gap or external leading.Syntaxline-gap-override: normal..
letter-spacing
letter-spacingThe letter-spacing CSS property sets the horizontal spacing behavior between text characters. This value is added to the natural spacing between characters while rendering the text. Posi..
<length-percentage>
<length-percentage>The <length-percentage> CSS data type represents a value that can be either a <length> or a <percentage>.SyntaxRefer to the documentation for <length> ..
<length>
<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..
@left-bottom
@pageThe @page CSS at-rule is used to modify some CSS properties when printing a document.Syntax@page { margin: 1cm; } @page :first { margin: 2cm; } Descriptors size Specifies the target..
@layer
@layerExperimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production. The @layer CSS at-rule declares a cascade layer. Rules within a c..
:last-of-type
:last-of-typeThe :last-of-type CSS pseudo-class represents the last element of its type among a group of sibling elements. /* Selects any <p> that is the last element of its type among its si..
@keyframes
@keyframesThe @keyframes CSS at-rule controls the intermediate steps in a CSS animation sequence by defining styles for keyframes (or waypoints) along the animation sequence. This gives more control o..
justify-tracks
justify-tracksExperimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production. The justify-tracks CSS property sets the alignment in the..
justify-self
justify-selfThe CSS justify-self property sets the way a box is justified inside its alignment container along the appropriate axis. The effect of this property is dependent of the layout mode we are ..
justify-items
justify-itemsThe CSS justify-items property defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis. The effect of th..
justify-content
justify-contentThe CSS justify-content property defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid contai..
length#in
<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#ic
<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..
:is
:is() (:matches(), :any()) Note: :matches() was renamed to :is() in CSSWG issue #3258. The :is() CSS pseudo-class function takes a selector list as its argument, and selects any element that can be..
@import
@importThe @import CSS at-rule is used to import style rules from other style sheets.Syntax@import url; @import url list-of-media-queries; @import url supports( supports-query ); @import url supports(..
image-orientation
image-orientationThe image-orientation CSS property specifies a layout-independent correction to the orientation of an image. /* keyword values */ image-orientation: none; image-orientation: from-imag..
:host-context()
:host-context()The :host-context() CSS pseudo-class function selects the shadow host of the shadow DOM containing the CSS it is used inside (so you can select a custom element from inside its shadow D..
:host()
:host()The :host() CSS pseudo-class function selects the shadow host of the shadow DOM containing the CSS it is used inside (so you can select a custom element from inside its shadow DOM) — but only..
height
heightThe height CSS property specifies the height of an element. By default, the property defines the height of the content area. If box-sizing is set to border-box, however, it instead determines th..
:has
:has()The :has() CSS pseudo-class represents an element if any of the selectors passed as parameters (relative to the :scope of the given element) match at least one element. /* Selects any <a>,..
grid-template-rows
grid-template-rowsThe grid-template-rows CSS property defines the line names and track sizing functions of the grid rows.Syntax/* Keyword value */ grid-template-rows: none; /* <track-list> valu..
grid-template-columns
grid-template-columnsThe grid-template-columns CSS property defines the line names and track sizing functions of the grid columns.Syntax/* Keyword value */ grid-template-columns: none; /* <track-l..
grid-template
grid-templateThe grid-template CSS property is a shorthand property for defining grid columns, rows, and areas.Constituent propertiesThis property is a shorthand for the following CSS properties: g..
grid-row-start
grid-row-startThe grid-row-start CSS property specifies a grid item's start position within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifyin..
grid-row-end
grid-row-endThe grid-row-end CSS property specifies a grid item's end position within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the ..
grid-row
grid-rowThe grid-row CSS shorthand property specifies a grid item's size and location within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifyi..
grid-column-start
grid-column-startThe grid-column-start CSS property specifies a grid item's start position within the grid column by contributing a line, a span, or nothing (automatic) to its grid placement. This sta..
grid-column-end
grid-column-endThe grid-column-end CSS property specifies a grid item's end position within the grid column by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specif..
grid-column
grid-columnThe grid-column CSS shorthand property specifies a grid item's size and location within a grid column by contributing a line, a span, or nothing (automatic) to its grid placement, thereby s..
grid-auto-rows
grid-auto-rowsThe grid-auto-rows CSS property specifies the size of an implicitly-created grid row track or pattern of tracks. If a grid item is positioned into a row that is not explicitly sized by g..
grid-auto-columns
grid-auto-columnsThe grid-auto-columns CSS property specifies the size of an implicitly-created grid column track or pattern of tracks. If a grid item is positioned into a column that is not explicitl..
grid-area
grid-areaThe grid-area CSS shorthand property specifies a grid item's size and location within a grid by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying t..
format()
srcThe src CSS descriptor of the @font-face rule specifies the resource containing font data. It is required for the @font-face rule to be valid.Syntax/* <url> values */ src: url(https://someweb..
font-weight (@font-face)
font-weightThe font-weight CSS descriptor allows authors to specify font weights for the fonts specified in the @font-face rule. The font-weight property can separately be used to set how thick or thi..
font-weight
font-weightThe font-weight CSS property sets the weight (or boldness) of the font. The weights available depend on the font-family that is currently set.Syntax/* Keyword values */ font-weight: normal;..
font-variation-settings (@font-face)
font-variation-settingsThe font-variation-settings CSS descriptor allows authors to specify low-level OpenType or TrueType font variations in the @font-face rule.Syntax/* Use the default settings */ f..
font-variation-settings
font-variation-settingsThe font-variation-settings CSS property provides low-level control over variable font characteristics, by specifying the four letter axis names of the characteristics you want ..
font-variant-position
font-variant-positionThe font-variant-position CSS property controls the use of alternate, smaller glyphs that are positioned as superscript or subscript. The glyphs are positioned relative to the bas..
font-variant-numeric
font-variant-numericThe font-variant-numeric CSS property controls the usage of alternate glyphs for numbers, fractions, and ordinal markers.Syntaxfont-variant-numeric: normal; font-variant-numeric: o..
font-variant-ligatures
font-variant-ligaturesThe font-variant-ligatures CSS property controls which ligatures and contextual forms are used in textual content of the elements it applies to. This leads to more harmonized for..
font-variant-east-asian
font-variant-east-asianThe font-variant-east-asian CSS property controls the use of alternate glyphs for East Asian scripts, like Japanese and Chinese. font-variant-east-asian: normal; font-variant-ea..
font-variant-caps
font-variant-capsThe font-variant-caps CSS property controls the use of alternate glyphs for capital letters. When a given font includes capital letter glyphs of multiple different sizes, this propert..
font-variant-alternates
font-variant-alternatesThe font-variant-alternates CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in @font-feature-values. /..
font-variant (@font-face)
font-variantThe font-variant CSS shorthand property allows you to set all the font variants for the fonts specified in the @font-face rule.Constituent propertiesThis property is a shorthand for the fo..
font-variant
font-variantThe font-variant CSS shorthand property allows you to set all the font variants for a font. You can also set the CSS Level 2 (Revision 1) values of font-variant, (that is, normal or small-..
font-synthesis
font-synthesisThe font-synthesis CSS property controls which missing typefaces, bold, italic, or small-caps, may be synthesized by the browser.Syntaxfont-synthesis: none; font-synthesis: weight; font-..
font-style (@font-face)
font-styleThe font-style CSS descriptor allows authors to specify font styles for the fonts specified in the @font-face rule. For a particular font family, authors can download various font faces whic..
font-style
font-styleThe font-style CSS property sets whether a font should be styled with a normal, italic, or oblique face from its font-family. Italic font faces are generally cursive in nature, usually using..
font-stretch (@font-face)
font-stretchThe font-stretch CSS descriptor allows authors to specify a normal, condensed, or expanded face for the fonts specified in the @font-face rule. For a particular font family, authors can do..
font-stretch
font-stretchThe font-stretch CSS property selects a normal, condensed, or expanded face from a font.Syntax/* Keyword values */ font-stretch: ultra-condensed; font-stretch: extra-condensed; font-stretc..
font-size-adjust
font-size-adjustThe font-size-adjust CSS property sets the size of lower-case letters relative to the current font size (which defines the size of upper-case letters). /* Use the specified font size *..
font-size
font-sizeThe font-size CSS property sets the size of the font. Changing the font size also updates the sizes of the font size-relative <length> units, such as em, ex, and so forth.Syntax/* <a..
font-optical-sizing
font-optical-sizingThe font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.Syntax/* keyword values */ font-optical-sizing: none; font-optical-sizin..
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..
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-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..
: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 ..
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..
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 ..
descent-override (@font-face)
descent-overrideThe descent-override CSS descriptor defines the descent metric for the font. The descent metric is the height below the baseline that CSS uses to lay out line boxes in an inline format..
:defined
:definedThe :defined CSS pseudo-class represents any element that has been defined. This includes any standard element built in to the browser, and custom elements that have been successfully defined ..
length#cm
<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#ch
<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#cap
<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..
::cue-region
::cue-regionExperimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production. The ::cue-region CSS pseudo-element matches WebVTT cues wit..
::cue
::cueThe ::cue CSS pseudo-element matches WebVTT cues within a selected element. This can be used to style captions and other cues in media with VTT tracks. ::cue { color: yellow; font-weight: bol..
cross-fade()
cross-fade() The cross-fade() CSS function can be used to blend two or more images at a defined transparency. It can be used for many simple image manipulations, such as tinting an image with a so..
counters()
counters()The counters() CSS function enables nested counters, returning a concatenated string representing the current values of the named counters, if there are any. The counters() function has two ..
@counter-style
@counter-styleThe @counter-style CSS at-rule lets you define counter styles that are not part of the predefined set of styles. A @counter-style rule defines how to convert a counter value into a strin..
counter-set
counter-setThe counter-set CSS property sets a CSS counter to a given value. It manipulates the value of existing counters, and will only create new counters if there isn't already a counter of the gi..
counter-reset
counter-reset The counter-reset CSS property resets a CSS counter to a given value. This property will create a new counter or reversed counter with the given name on the specified element. No..
counter-increment
counter-incrementThe counter-increment CSS property increases or decreases the value of a CSS counter by a given value. Note: The counter's value can be reset to an arbitrary number using the count..
<counter>
counter() The counter() CSS function returns a string representing the current value of the named counter, if there is one. It is generally used in the content property of pseudo-elements, but can..
content
contentThe content CSS property replaces an element with a generated value. Objects inserted using the content property are anonymous replaced elements. /* Keywords that cannot be combined with other ..
column-rule-color
column-rule-colorThe column-rule-color CSS property sets the color of the line drawn between columns in a multi-column layout.Syntax/* <color> values */ column-rule-color: red; column-rule-color..
column-gap
column-gap (grid-column-gap)The column-gap CSS property sets the size of the gap (gutter) between an element's columns. Initially a part of Multi-column Layout, the definition of column-gap has been b..
color-adjust
print-color-adjust The print-color-adjust CSS property sets what, if anything, the user agent may do to optimize the appearance of the element on the output device. By default, the browser is allo..
color
colorThe color CSS property sets the foreground color value of an element's text and text decorations, and sets the <currentcolor> value. currentcolor may be used as an indirect value on other p..
clip-path
clip-pathThe clip-path CSS property creates a clipping region that sets what part of an element should be shown. Parts that are inside the region are shown, while those outside are hidden.Syntax/* Key..
clip
clipThe clip CSS property defines a visible portion of an element. The clip property applies only to absolutely positioned elements — that is, elements with position:absolute or position:fixed. /* K..
clamp()
clamp()The clamp() CSS function clamps a value between an upper and lower bound. clamp() enables selecting a middle value within a range of values between a defined minimum and maximum. It takes three..
character-variant()
font-variant-alternatesThe font-variant-alternates CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in @font-feature-values. /..
@character-variant
@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 ..
caret-color
caret-colorThe caret-color CSS property sets the color of the insertion caret, the visible marker where the next character typed will be inserted. This is sometimes referred to as the text input curso..
calc()
calc()The calc() CSS function lets you perform calculations when specifying CSS property values. It can be used anywhere a <length>, <frequency>, <angle>, <time>, <percentag..
break-inside
break-insideThe break-inside CSS property sets how page, column, or region breaks should behave inside a generated box. If there is no generated box, the property is ignored. /* Keyword values */ brea..
break-before
break-beforeThe break-before CSS property sets how page, column, or region breaks should behave before a generated box. If there is no generated box, the property is ignored. /* Generic break values *..
break-after
break-afterThe break-after CSS property sets how page, column, or region breaks should behave after a generated box. If there is no generated box, the property is ignored. /* Generic break values */ b..
box-shadow
box-shadowThe box-shadow CSS property adds shadow effects around an element's frame. You can set multiple effects separated by commas. A box shadow is described by X and Y offsets relative to the elem..
box-decoration-break
box-decoration-breakThe box-decoration-break CSS property specifies how an element's fragments should be rendered when broken across multiple lines, columns, or pages. The specified value will impact ..
@bottom-center
@pageThe @page CSS at-rule is used to modify some CSS properties when printing a document.Syntax@page { margin: 1cm; } @page :first { margin: 2cm; } Descriptors size Specifies the target..
bottom
bottomThe bottom CSS property participates in setting the vertical position of a positioned element. It has no effect on non-positioned elements. The effect of bottom depends on how the element is pos..
border-width
border-widthThe border-width shorthand CSS property sets the width of an element's border.Constituent propertiesThis property is a shorthand for the following CSS properties: border-bottom-width ..
border-top-width
border-top-widthThe border-top-width CSS property sets the width of the top border of an element.Syntax/* Keyword values */ border-top-width: thin; border-top-width: medium; border-top-width: thick; ..
border-top-style
border-top-styleThe border-top-style CSS property sets the line style of an element's top border. Note: The specification doesn't define how borders of different styles connect in the corners. Synt..
border-top-right-radius
border-top-right-radiusThe border-top-right-radius CSS property rounds the top-right corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse ..
border-top-left-radius
border-top-left-radiusThe border-top-left-radius CSS property rounds the top-left corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse def..
border-top-color
border-top-colorThe border-top-color CSS property sets the color of an element's top border. It can also be set with the shorthand CSS properties border-color or border-top.Syntax/* <color> valu..
border-top
border-topThe border-top shorthand CSS property sets all the properties of an element's top border. As with all shorthand properties, border-top always sets the values of all of the properties that it..
border-style
border-styleThe border-style shorthand CSS property sets the line style for all four sides of an element's border.Constituent propertiesThis property is a shorthand for the following CSS properties: ..
border-start-start-radius
border-start-start-radiusThe border-start-start-radius CSS property defines a logical border radius on an element, which maps to a physical border radius that depends on the element's writing-mode, di..
border-start-end-radius
border-start-end-radiusThe border-start-end-radius CSS property defines a logical border radius on an element, which maps to a physical border radius depending on the element's writing-mode, direction..
border-right-width
border-right-widthThe border-right-width CSS property sets the width of the right border of an element.Syntax/* Keyword values */ border-right-width: thin; border-right-width: medium; border-right-wid..
border-right-style
border-right-styleThe border-right-style CSS property sets the line style of an element's right border. Note: The specification doesn't define how borders of different styles connect in the corners..
border-right-color
border-right-colorThe border-right-color CSS property sets the color of an element's right border. It can also be set with the shorthand CSS properties border-color or border-right.Syntax/* <color&..
border-right
border-rightThe border-right shorthand CSS property sets all the properties of an element's right border. As with all shorthand properties, border-right always sets the values of all of the properties..
border-radius
border-radiusThe border-radius CSS property rounds the corners of an element's outer border edge. You can set a single radius to make circular corners, or two radii to make elliptical corners. The rad..
border-left-width
border-left-widthThe border-left-width CSS property sets the width of the left border of an element.Syntax/* Keyword values */ border-left-width: thin; border-left-width: medium; border-left-width: th..
border-left-style
border-left-styleThe border-left-style CSS property sets the line style of an element's left border. Note: The specification doesn't define how borders of different styles connect in the corners. S..
border-left-color
border-left-colorThe border-left-color CSS property sets the color of an element's left border. It can also be set with the shorthand CSS properties border-color or border-left.Syntax/* <color> ..
border-left
border-leftThe border-left shorthand CSS property sets all the properties of an element's left border. As with all shorthand properties, border-left always sets the values of all of the properties tha..
border-inline-start
border-inline-startThe border-inline-start CSS property is a shorthand property for setting the individual logical inline-start border property values in a single place in the style sheet.Constituent ..
border-inline-end
border-inline-endThe border-inline-end CSS property is a shorthand property for setting the individual logical inline-end border property values in a single place in the style sheet.Constituent proper..
border-inline
border-inlineThe border-inline CSS property is a shorthand property for setting the individual logical inline border property values in a single place in the style sheet. The physical borders to which..
border-image-width
border-image-widthThe border-image-width CSS property sets the width of an element's border image. If this property's value is greater than the element's border-width, the border image will extend bey..
border-image-source
border-image-sourceThe border-image-source CSS property sets the source image used to create an element's border image. The border-image-slice property is used to divide the source image into regions,..
border-image-slice
border-image-sliceThe border-image-slice CSS property divides the image specified by border-image-source into regions. These regions form the components of an element's border image. The slicing proce..
border-end-start-radius
border-end-start-radiusThe border-end-start-radius CSS property defines a logical border radius on an element, which maps to a physical border radius depending on the element's writing-mode, direction..
border-end-end-radius
border-end-end-radiusThe border-end-end-radius CSS property defines a logical border radius on an element, which maps to a physical border radius that depends on the element's writing-mode, direction,..
border-color
border-colorThe border-color shorthand CSS property sets the color of an element's border. Each side can be set individually using border-top-color, border-right-color, border-bottom-color, and border..
border-bottom-width
border-bottom-widthThe border-bottom-width CSS property sets the width of the bottom border of an element.Syntax/* Keyword values */ border-bottom-width: thin; border-bottom-width: medium; border-bott..
border-bottom-style
border-bottom-styleThe border-bottom-style CSS property sets the line style of an element's bottom border. Note: The specification doesn't define how borders of different styles connect in the corn..
border-bottom-right-radius
border-bottom-right-radiusThe border-bottom-right-radius CSS property rounds the bottom-right corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the..
border-bottom-left-radius
border-bottom-left-radiusThe border-bottom-left-radius CSS property rounds the bottom-left corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the el..
border-bottom
border-bottomThe border-bottom shorthand CSS property sets an element's bottom border. It sets the values of border-bottom-width, border-bottom-style and border-bottom-color. As with all shorthand pro..
border-block-start
border-block-startThe border-block-start CSS property is a shorthand property for setting the individual logical block-start border property values in a single place in the style sheet.Constituent pro..
border-block-end
border-block-endThe border-block-end CSS property is a shorthand property for setting the individual logical block-end border property values in a single place in the style sheet.Constituent propertie..
border-block
border-blockThe border-block CSS property is a shorthand property for setting the individual logical block border property values in a single place in the style sheet. border-block can be used to set ..
border
borderThe border shorthand CSS property sets an element's border. It sets the values of border-width, border-style, and border-color.Constituent propertiesThis property is a shorthand for the followin..
::before (:before)
::before (:before)In CSS, ::before creates a pseudo-element that is the first child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inl..
background-size
background-size The background-size CSS property sets the size of the element's background image. The image can be left to its natural size, stretched, or constrained to fit the available space. ..
background-repeat
background-repeatThe background-repeat CSS property sets how background images are repeated. A background image can be repeated along the horizontal and vertical axes, or not repeated at all. By defau..
background-position-y
background-position-yThe background-position-y CSS property sets the initial vertical position for each background image. The position is relative to the position layer set by background-origin. The v..
background-position-x
background-position-xThe background-position-x CSS property sets the initial horizontal position for each background image. The position is relative to the position layer set by background-origin. The..
background-position
background-positionThe background-position CSS property sets the initial position for each background image. The position is relative to the position layer set by background-origin.Syntax/* Keyword va..
background-origin
background-originThe background-origin CSS property sets the background's origin: from the border start, inside the border, or inside the padding. Note that background-origin is ignored when backgroun..
background-image
background-imageThe background-image CSS property sets one or more background images on an element. The background images are drawn on stacking context layers on top of each other. The first layer spe..
background-color
background-colorThe background-color CSS property sets the background color of an element.Syntax/* Keyword values */ background-color: red; background-color: indigo; /* Hexadecimal value */ backgroun..
background-clip
background-clipThe background-clip CSS property sets whether an element's background extends underneath its border box, padding box, or content box. If the element has no background-image or backgroun..
background-blend-mode
background-blend-modeThe background-blend-mode CSS property sets how an element's background images should blend with each other and with the element's background color. Blending modes should be defin..
background-attachment
background-attachmentThe background-attachment CSS property sets whether a background image's position is fixed within the viewport, or scrolls with its containing block.Syntax/* Keyword values */ bac..
background
backgroundThe background shorthand CSS property sets all background style properties at once, such as color, image, origin and size, or repeat method.Constituent propertiesThis property is a shorthand..
backface-visibility
backface-visibilityThe backface-visibility CSS property sets whether the back face of an element is visible when turned towards the user. An element's back face is a mirror image of its front face. Th..
backdrop-filter
backdrop-filterThe backdrop-filter CSS property lets you apply graphical effects such as blurring or color shifting to the area behind an element. Because it applies to everything behind the element, ..
attr()
attr() Note: The attr() function can be used with any CSS property, but support for properties other than content is experimental, and support for the type-or-unit parameter is sparse. The attr() C..
ascent-override (@font-face)
ascent-overrideThe ascent-override CSS descriptor defines the ascent metric for the font. The ascent metric is the height above the baseline that CSS uses to lay out line boxes in an inline formatting..
appearance
appearance (-moz-appearance, -webkit-appearance)The appearance CSS property is used to display an element using platform-native styling, based on the operating system's theme. The -moz-appearance and ..
annotation()
font-variant-alternatesThe font-variant-alternates CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in @font-feature-values. /..
@annotation
@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 ..
animation-timing-function
animation-timing-functionThe animation-timing-function CSS property sets how an animation progresses through the duration of each cycle. It is often convenient to use the shorthand property animation ..
animation-play-state
animation-play-stateThe animation-play-state CSS property sets whether an animation is running or paused. Resuming a paused animation will start the animation from where it left off at the time it was..
animation-name
animation-nameThe animation-name CSS property specifies the names of one or more @keyframes at-rules describing the animation or animations to apply to the element. It is often convenient to use the s..
animation-iteration-count
animation-iteration-countThe animation-iteration-count CSS property sets the number of times an animation sequence should be played before stopping. If multiple values are specified, each time the ani..
animation-fill-mode
animation-fill-modeThe animation-fill-mode CSS property sets how a CSS animation applies styles to its target before and after its execution. It is often convenient to use the shorthand property anima..
animation-direction
animation-directionThe animation-direction CSS property sets whether an animation should play forward, backward, or alternate back and forth between playing the sequence forward and backward. It is of..
animation
animationThe animation shorthand CSS property applies an animation between styles. It is a shorthand for animation-name, animation-duration, animation-timing-function, animation-delay, animation-itera..
all
allThe all shorthand CSS property resets all of an element's properties except unicode-bidi, direction, and CSS Custom Properties. It can set properties to their initial or inherited values, or to the..
align-tracks
align-tracksExperimental: This is an experimental technologyCheck the Browser compatibility table carefully before using this in production. The align-tracks CSS property sets the alignment in the mas..
align-self
align-selfThe align-self CSS property overrides a grid or flex item's align-items value. In Grid, it aligns the item inside the grid area. In Flexbox, it aligns the item on the cross axis. The propert..
align-items
align-itemsThe CSS align-items property sets the align-self value on all direct children as a group. In Flexbox, it controls the alignment of items on the Cross Axis. In Grid Layout, it controls the a..
align-content
align-contentThe CSS align-content property sets the distribution of space between and around content items along a flexbox's cross-axis or a grid's block axis. The interactive example below use Grid ..
::after (:after)
::after (:after)In CSS, ::after creates a pseudo-element that is the last child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inline ..
additive-symbols (@counter-style)
additive-symbolsThe additive-symbols descriptor lets you specify symbols when the value of a counter system descriptor is additive. The additive-symbols descriptor defines additive tuples, each of whi..
accent-color
accent-colorThe accent-color CSS property sets the accent color for user-interface controls generated by some elements. Browsers that support accent-color currently apply it to the following HTML elem..
