0% found this document useful (0 votes)
8 views28 pages

CSS Reference

The document is a comprehensive reference for CSS properties and their functionalities, covering various aspects such as selectors, animations, backgrounds, borders, and more. It includes definitions and explanations for numerous CSS properties, allowing users to understand how to implement them effectively in web design. Additionally, it provides links to tutorials, exercises, and certification options for further learning.

Uploaded by

marcar1976
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
8 views28 pages

CSS Reference

The document is a comprehensive reference for CSS properties and their functionalities, covering various aspects such as selectors, animations, backgrounds, borders, and more. It includes definitions and explanations for numerous CSS properties, allowing users to understand how to implement them effectively in web design. Additionally, it provides links to tutorials, exercises, and certification options for further learning.

Uploaded by

marcar1976
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 28

 Tutorials  References  Exercises  Certificates  Search... Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References Filter... ×
×
ADVERTIS
ADVERTISEMENT

CSS Reference
CSS Browser Support
CSS Selectors
CSS Combinators
CSS Pseudo-classes CSS Reference
CSS Pseudo-elements
CSS At-rules ❮ Home Next ❯
CSS Functions
CSS Reference Aural
CSS Web Safe Fonts
CSS Fallback Fonts
CSS Properties
CSS Animatable
CSS Units
 Search..

CSS PX-EM Converter


CSS Colors A
CSS Color Values
CSS Default Values
accent-color Specifies an accent color for user-interface controls
CSS Entities

align-content Specifies the alignment between the lines inside a flexible container
CSS Properties when the items do not use all available space
accent-color
align-items Specifies the alignment for items inside a flexible container
align-content
align-items align-self Specifies the alignment for selected items inside a flexible container
align-self
all all Resets all properties (except unicode-bidi and direction)
animation
animation A shorthand property for all the animation-* properties
animation-delay
animation-direction ❯
 Tutorials  References  animation-delay
Exercises  Certificates Specifies a delay for the start of an animation Upgrade Get Certified

animation-direction Specifies whether an animation should be played forward, backward or


HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References animation-duration
in alternate cycles

× take to complete one cycle


Specifies how long an animation should
×
ADVERTIS

CSS Reference
animation-fill-mode Specifies a style for the element when the animation is not playing
CSS Browser Support
(before it starts, after it ends, or both)
CSS Selectors
CSS Combinators animation-iteration-count Specifies the number of times an animation should be played
CSS Pseudo-classes
CSS Pseudo-elements animation-name Specifies a name for the @keyframes animation
CSS At-rules
animation-play-state Specifies whether the animation is running or paused
CSS Functions COLOR
CSS Reference Aural animation-timing-function Specifies the speed curve of an animation
PICKER
CSS Web Safe Fonts
aspect-ratio Specifies preferred aspect ratio of an element
CSS Fallback Fonts
CSS Animatable
CSS Units
CSS PX-EM Converter
B
CSS Colors 
CSS Color Values backdrop-filter Defines a graphical effect to the area behind an element 
CSS Default Values
backface-visibility Defines whether or not the back face of an element should be visible
CSS Entities when facing the user

CSS Properties background A shorthand property for all the background-* properties

accent-color
background-attachment Sets whether a background image scrolls with the rest of the page, or is
align-content fixed
align-items
align-self background-blend-mode Specifies the blending mode of each background layer (color/image)
all
background-clip Defines how far the background (color or image) should extend within an
animation
element
animation-delay
animation-direction ❯
 Tutorials  References  background-color
Exercises  Certificates Specifies the background color of an element Upgrade Get Certified

background-image Specifies one or more background images for an element


HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
background-origin Specifies the origin position of a background image
×
×
ADVERTIS

CSS Reference
background-position Specifies the position of a background image

CSS Browser Support


background-position-x Specifies the position of a background image on x-axis
CSS Selectors
CSS Combinators background-position-y Specifies the position of a background image on y-axis
CSS Pseudo-classes
background-repeat Sets if/how a background image will be repeated
CSS Pseudo-elements
CSS At-rules background-size Specifies the size of the background images
CSS Functions
CSS Reference Aural block-size Specifies the size of an element in block direction
CSS Web Safe Fonts
border A shorthand property for border-width, border-style and border-color
CSS Fallback Fonts
CSS Animatable border-block A shorthand property for border-block-width, border-block-style and
CSS Units border-block-color
CSS PX-EM Converter
border-block-color Sets the color of the borders at start and end in the block direction
CSS Colors
CSS Color Values border-block-end A shorthand property for border-block-end-width, border-block-end-style
CSS Default Values and border-block-end-color
CSS Entities
border-block-end-color Sets the color of the border at the end in the block direction

CSS Properties border-block-end-style Sets the style of the border at the end in the block direction
accent-color
align-content
border-block-end-width Sets the width of the border at the end in the block direction

align-items
border-block-start A shorthand property for border-block-start-width, border-block-start-
align-self style and border-block-start-color
all
animation border-block-start-color Sets the color of the border at the start in the block direction
animation-delay
animation-direction ❯
 Tutorials  References 
border-block-start-style
Exercises  Certificates 
Sets the style of the border at the start in the block direction
Upgrade Get Certified

border-block-start-width Sets the width of the border at the start in the block direction
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
border-block-style Sets the style of the borders at start and end in the block direction
×
×
ADVERTIS

border-block-width Sets the width of the borders at start and end in the block direction
CSS Reference
CSS Browser Support
border-bottom A shorthand property for border-bottom-width, border-bottom-style and
CSS Selectors border-bottom-color
CSS Combinators
CSS Pseudo-classes border-bottom-color Sets the color of the bottom border
CSS Pseudo-elements
border-bottom-left-radius Defines the radius of the border of the bottom-left corner
CSS At-rules
CSS Functions border-bottom-right-radius Defines the radius of the border of the bottom-right corner
CSS Reference Aural
border-bottom-style Sets the style of the bottom border
CSS Web Safe Fonts
CSS Fallback Fonts border-bottom-width Sets the width of the bottom border
CSS Animatable
CSS Units border-collapse Sets whether table borders should collapse into a single border or be
CSS PX-EM Converter separated
CSS Colors
border-color Sets the color of the four borders
CSS Color Values
CSS Default Values border-end-end-radius Sets the radius of the corner between the block-end and the inline-end
CSS Entities sides of the element

border-end-start-radius Sets the radius of the corner between the block-end and the inline-start
CSS Properties
sides of the element
accent-color
align-content border-image A shorthand property for all the border-image-* properties
align-items
border-image-outset Specifies the amount by which the border image area extends beyond
align-self
the border box
all
animation
animation-delay
animation-direction ❯
 Tutorials  References  border-image-repeat
Exercises  Certificates Specifies whether the border image should be repeated, rounded
stretched
or
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
border-image-slice

border-image-source
Specifies how to slice the border image

Specifies the path to the image to×


be used as a border
×
ADVERTIS

CSS Reference
border-image-width Specifies the width of the border image
CSS Browser Support
CSS Selectors border-inline A shorthand property for border-inline-width, border-inline-style and
CSS Combinators border-inline-color
CSS Pseudo-classes
CSS Pseudo-elements border-inline-color Sets the color of the borders at start and end in the inline direction
CSS At-rules
border-inline-end A shorthand property for border-inline-end-width, border-inline-end-style
CSS Functions
and border-inline-end-color
CSS Reference Aural
CSS Web Safe Fonts border-inline-end-color Sets the color of the border at the end in the inline direction
CSS Fallback Fonts
border-inline-end-style Sets the style of the border at the end in the inline direction
CSS Animatable
CSS Units border-inline-end-width Sets the width of the border at the end in the inline direction
CSS PX-EM Converter
CSS Colors border-inline-start A shorthand property for border-inline-start-width, border-inline-start-
CSS Color Values style and border-inline-start-color

CSS Default Values


border-inline-start-color Sets the color of the border at the start in the inline direction
CSS Entities
border-inline-start-style Sets the style of the border at the start in the inline direction
CSS Properties
border-inline-start-width Sets the width of the border at the start in the inline direction
accent-color
align-content border-inline-style Sets the style of the borders at start and end in the inline direction
align-items
border-inline-width Sets the width of the borders at start and end in the inline direction
align-self
all border-left A shorthand property for all the border-left-* properties
animation
animation-delay border-left-color Sets the color of the left border
animation-direction ❯
 Tutorials  References  border-left-style
Exercises  Certificates Sets the style of the left border Upgrade Get Certified

border-left-width Sets the width of the left border


HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
border-radius A shorthand property for the four border-*-radius properties
×
×
ADVERTIS

CSS Reference
border-right A shorthand property for all the border-right-* properties

CSS Browser Support


border-right-color Sets the color of the right border
CSS Selectors
CSS Combinators border-right-style Sets the style of the right border
CSS Pseudo-classes
border-right-width Sets the width of the right border
CSS Pseudo-elements
CSS At-rules border-spacing Sets the distance between the borders of adjacent cells
CSS Functions
CSS Reference Aural border-start-end-radius Sets the radius of the corner between the block-start and the inline-end
CSS Web Safe Fonts
sides of the element

CSS Fallback Fonts border-start-start-radius Sets the radius of the corner between the block-start and the inline-start
CSS Animatable sides of the element
CSS Units
CSS PX-EM Converter border-style Sets the style of the four borders
CSS Colors
border-top A shorthand property for border-top-width, border-top-style and border-
CSS Color Values
top-color
CSS Default Values
CSS Entities 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


CSS Properties
accent-color border-top-right-radius Defines the radius of the border of the top-right corner
align-content
border-top-style Sets the style of the top border
align-items
align-self border-top-width Sets the width of the top border
all
animation border-width Sets the width of the four borders
animation-delay
animation-direction ❯
 Tutorials  References 
bottom
Exercises  Certificates 
Sets the elements position, from the bottom of its parent element
Upgrade Get Certified

box-decoration-break Sets the behavior of the background and border of an element at page-
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References box-reflect
break, or, for in-line elements, at line-break.

The box-reflect property is used to×create a reflection of an element.


×
ADVERTIS

CSS Reference
box-shadow Attaches one or more shadows to an element
CSS Browser Support
CSS Selectors box-sizing Defines how the width and height of an element are calculated: should
CSS Combinators they include padding and borders, or not
CSS Pseudo-classes
CSS Pseudo-elements break-after Specifies whether or not a page-, column-, or region-break should occur
CSS At-rules after the specified element

CSS Functions
break-before Specifies whether or not a page-, column-, or region-break should occur
CSS Reference Aural before the specified element
CSS Web Safe Fonts
CSS Fallback Fonts break-inside Specifies whether or not a page-, column-, or region-break should occur
CSS Animatable inside the specified element
CSS Units
CSS PX-EM Converter
CSS Colors
C
CSS Color Values
CSS Default Values caption-side Specifies the placement of a table caption
CSS Entities
caret-color Specifies the color of the cursor (caret) in inputs, textareas, or any
element that is editable
CSS Properties
accent-color @charset Specifies the character encoding used in the style sheet
align-content
clear Specifies what should happen with the element that is next to a floating
align-items
element
align-self
all clip Deprecated in favor of clip-path. Clips an absolutely positioned element
animation
clip-path Clips an element to a basic shape or to an SVG source
animation-delay
animation-direction ❯
 Tutorials  References  colorExercises  Certificates Sets the color of text Upgrade Get Certified

color-scheme Indicates which operating system color scheme an element should


HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References column-count
render with

× element should be divided into


Specifies the number of columns an
×
ADVERTIS

CSS Reference
column-fill Specifies how to fill columns, balanced or not
CSS Browser Support
CSS Selectors column-gap Specifies the gap between the columns
CSS Combinators
CSS Pseudo-classes column-rule A shorthand property for all the column-rule-* properties
CSS Pseudo-elements
column-rule-color Specifies the color of the rule between columns
CSS At-rules
CSS Functions column-rule-style Specifies the style of the rule between columns
CSS Reference Aural
CSS Web Safe Fonts
column-rule-width Specifies the width of the rule between columns

CSS Fallback Fonts column-span Specifies how many columns an element should span across
CSS Animatable
CSS Units column-width Specifies the column width
CSS PX-EM Converter
columns A shorthand property for column-width and column-count
CSS Colors
CSS Color Values @container Define styles for elements in container, depending on the container's
CSS Default Values size or style
CSS Entities
content Used with the :before and :after pseudo-elements, to insert generated
content
CSS Properties
accent-color counter-increment Increases or decreases the value of one or more CSS counters
align-content
counter-reset Creates or resets one or more CSS counters
align-items
align-self counter-set Creates or sets one or more CSS counters
all
animation @counter-style Lets you define your own counter styles
animation-delay
animation-direction ❯
 Tutorials  References  cursor
Exercises  Certificates Specifies the mouse cursor to be displayed when pointing over
element
an
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

ReferencesD
CSS References ×
×
ADVERTIS

CSS Reference
CSS Browser Support direction Specifies the text direction/writing direction
CSS Selectors
display Specifies how a certain HTML element should be displayed
CSS Combinators
CSS Pseudo-classes
CSS Pseudo-elements
E
CSS At-rules
CSS Functions
empty-cells Specifies whether or not to display borders and background on empty
CSS Reference Aural
cells in a table
CSS Web Safe Fonts
CSS Fallback Fonts
CSS Animatable
F
CSS Units
CSS PX-EM Converter
filter Defines effects (e.g. blurring or color shifting) on an element before the
CSS Colors
element is displayed
CSS Color Values
CSS Default Values flex A shorthand property for the flex-grow, flex-shrink, and the flex-basis
CSS Entities properties

CSS Properties flex-basis Specifies the initial length of a flexible item

accent-color flex-direction Specifies the direction of the flexible items


align-content
align-items flex-flow A shorthand property for the flex-direction and the flex-wrap properties
align-self
flex-grow Specifies how much the item will grow relative to the rest
all
animation flex-shrink Specifies how the item will shrink relative to the rest
animation-delay
animation-direction ❯
 Tutorials  References  flex-wrap
Exercises  Certificates Specifies whether the flexible items should wrap or not Upgrade Get Certified

float Specifies whether an element should float to the left, right, or not at all
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
font A shorthand property for the font-style, font-variant, font-weight, font-
× properties
size/line-height, and the font-family
×
ADVERTIS

CSS Reference
@font-face Specifies a custom font to use to display text
CSS Browser Support
CSS Selectors font-family Specifies the font family for text
CSS Combinators
CSS Pseudo-classes font-feature-settings Allows control over advanced typographic features in OpenType fonts
CSS Pseudo-elements
font-kerning Controls the usage of the kerning information (how letters are spaced)
CSS At-rules
CSS Functions font-language-override Controls the usage of language-specific glyphs in a typeface
CSS Reference Aural
CSS Web Safe Fonts
@font-palette-values Allows you to customize the default values of a font-palette

CSS Fallback Fonts font-size Specifies the font size of text


CSS Animatable
CSS Units font-size-adjust Preserves the readability and size of text when fallback font occurs
CSS PX-EM Converter
font-stretch Selects a normal, condensed, or expanded face from a font family
CSS Colors
CSS Color Values font-style Specifies the font style for text
CSS Default Values
CSS Entities font-synthesis Controls which missing typefaces (bold or italic) may be synthesized by
the browser

CSS Properties font-variant Specifies whether or not a text should be displayed in a small-caps font
accent-color
align-content
font-variant-alternates Controls the usage of alternate glyphs associated to alternative names
defined in @font-feature-values
align-items
align-self font-variant-caps Controls the usage of alternate glyphs for capital letters
all
animation font-variant-east-asian Controls the usage of alternate glyphs for East Asian scripts (e.g
animation-delay Japanese and Chinese)
animation-direction ❯
 Tutorials  References  font-variant-ligatures
Exercises  Certificates Controls which ligatures and contextual forms are used in textual
content of the elements it applies to
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
font-variant-numeric Controls the usage of alternate glyphs for numbers, fractions, and
ordinal markers
×
×
ADVERTIS

CSS Reference font-variant-position Controls the usage of alternate glyphs of smaller size positioned as
CSS Browser Support superscript or subscript regarding the baseline of the font
CSS Selectors
font-weight Specifies the weight of a font
CSS Combinators
CSS Pseudo-classes
CSS Pseudo-elements
G
CSS At-rules
CSS Functions
gap A shorthand property for the row-gap and the column-gap properties
CSS Reference Aural
CSS Web Safe Fonts grid A shorthand property for the grid-template-rows, grid-template-columns,
CSS Fallback Fonts grid-template-areas, grid-auto-rows, grid-auto-columns, and the grid-
CSS Animatable auto-flow properties
CSS Units
CSS PX-EM Converter 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-
CSS Colors
column-end properties
CSS Color Values
CSS Default Values grid-auto-columns Specifies a default column size
CSS Entities
grid-auto-flow Specifies how auto-placed items are inserted in the grid
CSS Properties
grid-auto-rows Specifies a default row size
accent-color
align-content grid-column A shorthand property for the grid-column-start and the grid-column-end
align-items properties
align-self
grid-column-end Specifies where to end the grid item
all
animation grid-column-start Specifies where to start the grid item
animation-delay
animation-direction ❯
 Tutorials  References  grid-row
Exercises  Certificates A shorthand property for the grid-row-start and the grid-row-end
properties
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
grid-row-end

grid-row-start
Specifies where to end the grid item

×
Specifies where to start the grid item
×
ADVERTIS

CSS Reference
grid-template A shorthand property for the grid-template-rows, grid-template-columns
CSS Browser Support
and grid-areas properties
CSS Selectors
CSS Combinators grid-template-areas Specifies how to display columns and rows, using named grid items
CSS Pseudo-classes
CSS Pseudo-elements grid-template-columns Specifies the size of the columns, and how many columns in a grid
CSS At-rules layout
CSS Functions
grid-template-rows Specifies the size of the rows in a grid layout
CSS Reference Aural
CSS Web Safe Fonts
CSS Fallback Fonts H
CSS Animatable
CSS Units
hanging-punctuation Specifies whether a punctuation character may be placed outside the
CSS PX-EM Converter
line box
CSS Colors
CSS Color Values height Sets the height of an element
CSS Default Values
hyphens Sets how to split words to improve the layout of text
CSS Entities

hypenate-character Sets the character used at the end of line, before a hyphenation break
CSS Properties
accent-color
align-content I
align-items
align-self image-rendering Specifies the type of algorithm to use for image scaling
all
animation @import Allows you to import a style sheet into another style sheet
animation-delay
animation-direction ❯
 Tutorials  References 
initial-letter
Exercises  Certificates 
Specifies the size of the initial-letter and optionally the number of lines
the initial letter should sink (down in the text)
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
inline-size

inset
Specifies the size of an element in the inline direction

Specifies the distance between an×element and the parent element


×
ADVERTIS

CSS Reference
inset-block Specifies the distance between an element and the parent element in
CSS Browser Support
the block direction
CSS Selectors
CSS Combinators inset-block-end Specifies the distance between the end of an element and the parent
CSS Pseudo-classes element in the block direction
CSS Pseudo-elements
CSS At-rules inset-block-start Specifies the distance between the start of an element and the parent
element in the block direction
CSS Functions
CSS Reference Aural inset-inline Specifies the distance between an element and the parent element in
CSS Web Safe Fonts the inline direction
CSS Fallback Fonts
CSS Animatable inset-inline-end Specifies the distance between the end of an element and the parent
CSS Units element in the inline direction
CSS PX-EM Converter
inset-inline-start Specifies the distance between the start of an element and the parent
CSS Colors
element in the inline direction
CSS Color Values
CSS Default Values isolation Defines whether an element must create a new stacking content
CSS Entities

CSS Properties J
accent-color
align-content justify-content Specifies the alignment between the items inside a flexible container
align-items when the items do not use all available space
align-self
justify-items Is set on the grid container. Specifies the alignment of grid items in the
all
inline direction
animation
animation-delay
animation-direction ❯
 Tutorials  References  justify-self
Exercises  Certificates Is set on the grid item. Specifies the alignment of the grid itemUpgrade
inline direction
in the Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

ReferencesK
CSS References ×
×
ADVERTIS

CSS Reference
CSS Browser Support @keyframes Controls the steps in an animation by defining styles for points along the
CSS Selectors animation sequence
CSS Combinators
CSS Pseudo-classes
CSS Pseudo-elements
L
CSS At-rules
CSS Functions @layer Controls how the CSS cascade layers evaluates the order of styles
CSS Reference Aural
left Specifies the left position of a positioned element
CSS Web Safe Fonts
CSS Fallback Fonts letter-spacing Increases or decreases the space between characters in a text
CSS Animatable
CSS Units line-break Specifies how/if to break lines
CSS PX-EM Converter
line-height Sets the line height
CSS Colors
CSS Color Values list-style Sets all the properties for a list in one declaration
CSS Default Values
list-style-image Specifies an image as the list-item marker
CSS Entities

list-style-position Specifies the position of the list-item markers (bullet points)


CSS Properties
list-style-type Specifies the type of list-item marker
accent-color
align-content
align-items
align-self
M
all
animation margin Sets all the margin properties in one declaration
animation-delay
animation-direction ❯
 Tutorials  References  margin-block
Exercises  Certificates Specifies the margin in the block direction Upgrade Get Certified

margin-block-end Specifies the margin at the end in the block direction


HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
margin-block-start Specifies the margin at the start in the block direction
×
×
ADVERTIS

CSS Reference
margin-bottom Sets the bottom margin of an element

CSS Browser Support


margin-inline Specifies the margin in the inline direction
CSS Selectors
CSS Combinators margin-inline-end Specifies the margin at the end in the inline direction
CSS Pseudo-classes
margin-inline-start Specifies the margin at the start in the inline direction
CSS Pseudo-elements
CSS At-rules margin-left Sets the left margin of an element
CSS Functions
CSS Reference Aural margin-right Sets the right margin of an element
CSS Web Safe Fonts
margin-top Sets the top margin of an element
CSS Fallback Fonts
CSS Animatable marker Points to a marker that will be drawn on all vertices of an element's path
CSS Units (the first, middle, and last)
CSS PX-EM Converter
marker-end Points to a marker that will be drawn on the last vertex of an element's
CSS Colors
path
CSS Color Values
CSS Default Values marker-mid Points to a marker that will be drawn on all the middle vertices of an
CSS Entities element's path

marker-start Points to a marker that will be drawn on the first vertex of an element's
CSS Properties
path
accent-color
align-content mask A shorthand property for mask-image, mask-mode, mask-repeat, mask-
align-items position, mask-clip, mask-origin, mask-size and mask-composite
align-self
mask-clip Specifies which area is affected by a mask image
all
animation
animation-delay
animation-direction ❯
 Tutorials  References  mask-composite
Exercises  Certificates Specifies a compositing operation used on the current mask layer
the mask layers below it
with
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
mask-image

mask-mode
Specifies an image to be used as a mask layer for an element

Specifies whether the mask layer ×


image is treated as a luminance mask
×
ADVERTIS

CSS Reference or as an alpha mask


CSS Browser Support
mask-origin Specifies the origin position (the mask position area) of a mask layer
CSS Selectors
image
CSS Combinators
CSS Pseudo-classes mask-position Sets the starting position of a mask layer image (relative to the mask
CSS Pseudo-elements position area)
CSS At-rules
CSS Functions
mask-repeat Specifies how the mask layer image is repeated

CSS Reference Aural mask-size Specifies the size of a mask layer image
CSS Web Safe Fonts
CSS Fallback Fonts mask-type Specifies whether an SVG <mask> element is treated as a luminance
CSS Animatable mask or as an alpha mask
CSS Units
max-height Sets the maximum height of an element
CSS PX-EM Converter
CSS Colors max-width Sets the maximum width of an element
CSS Color Values
@media Sets the style rules for different media types/devices/sizes
CSS Default Values
CSS Entities max-block-size Sets the maximum size of an element in the block direction

CSS Properties max-inline-size Sets the maximum size of an element in the inline direction

accent-color
min-block-size Sets the minimum size of an element in the block direction
align-content
align-items min-inline-size Sets the minimum size of an element in the inline direction
align-self
min-height Sets the minimum height of an element
all
animation min-width Sets the minimum width of an element
animation-delay
animation-direction ❯
 Tutorials  References  mix-blend-mode
Exercises  Certificates Specifies how an element's content should blend with its direct
background
parent
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

ReferencesN
CSS References ×
×
ADVERTIS

CSS Reference
CSS Browser Support @namespace Defines an XML namespace to be used in the style sheet
CSS Selectors
CSS Combinators
CSS Pseudo-classes
O
CSS Pseudo-elements
CSS At-rules object-fit Specifies how the contents of a replaced element should be fitted to the
CSS Functions box established by its used height and width
CSS Reference Aural
object-position Specifies the alignment of the replaced element inside its box
CSS Web Safe Fonts
CSS Fallback Fonts offset A shorthand property for the offset-anchor, offset-distance, offset-path,
CSS Animatable offset-position, and the offset-rotate properties
CSS Units
CSS PX-EM Converter offset-anchor Specifies a point on an element that is fixed to the path it is animated
along
CSS Colors
CSS Color Values offset-distance Specifies the position along a path where an animated element is placed
CSS Default Values
CSS Entities offset-path Specifies the path an element is animated along

offset-position Specifies the initial position of an element along a path


CSS Properties
accent-color offset-rotate Specifies rotation of an element as it is animated along a path
align-content
opacity Sets the opacity level for an element
align-items
align-self order Sets the order of the flexible item, relative to the rest
all
animation orphans Sets the minimum number of lines that must be left at the bottom of a
animation-delay
page or column
animation-direction ❯
 Tutorials  References  outline
Exercises  Certificates A shorthand property for the outline-width, outline-style, and the
color properties
outline-
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
outline-color

outline-offset
Sets the color of an outline

× the border edge


Offsets an outline, and draws it beyond
×
ADVERTIS

CSS Reference
outline-style Sets the style of an outline
CSS Browser Support
CSS Selectors outline-width Sets the width of an outline
CSS Combinators
CSS Pseudo-classes overflow Specifies what happens if content overflows an element's box
CSS Pseudo-elements
overflow-anchor Specifies whether or not content in viewable area in a scrollable
CSS At-rules
contianer should be pushed down when new content is loaded above
CSS Functions
CSS Reference Aural overflow-wrap Specifies whether or not the browser can break lines with long words, if
CSS Web Safe Fonts they overflow the container
CSS Fallback Fonts
overflow-x Specifies whether or not to clip the left/right edges of the content, if it
CSS Animatable
overflows the element's content area
CSS Units
CSS PX-EM Converter overflow-y Specifies whether or not to clip the top/bottom edges of the content, if it
CSS Colors overflows the element's content area
CSS Color Values
overscroll-behavior Specifies whether to have scroll chaining or overscroll affordance in x-
CSS Default Values
and y-directions
CSS Entities

overscroll-behavior-block Specifies whether to have scroll chaining or overscroll affordance in the


CSS Properties block direction
accent-color
overscroll-behavior-inline Specifies whether to have scroll chaining or overscroll affordance in the
align-content
inline direction
align-items
align-self overscroll-behavior-x Specifies whether to have scroll chaining or overscroll affordance in x-
all direction
animation
animation-delay
animation-direction ❯
 Tutorials  References  overscroll-behavior-y
Exercises  Certificates Specifies whether to have scroll chaining or overscroll affordance
directions
in y-
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

ReferencesP
CSS References ×
×
ADVERTIS

CSS Reference
CSS Browser Support padding A shorthand property for all the padding-* properties
CSS Selectors
padding-block Specifies the padding in the block direction
CSS Combinators
CSS Pseudo-classes padding-block-end Specifies the padding at the end in the block direction
CSS Pseudo-elements
CSS At-rules padding-block-start Specifies the padding at the start in the block direction
CSS Functions
padding-bottom Sets the bottom padding of an element
CSS Reference Aural
CSS Web Safe Fonts padding-inline Specifies the padding in the inline direction
CSS Fallback Fonts
padding-inline-end Specifies the padding at the end in the inline direction
CSS Animatable
CSS Units padding-inline-start Specifies the padding at the start in the inline direction
CSS PX-EM Converter
CSS Colors padding-left Sets the left padding of an element
CSS Color Values
padding-right Sets the right padding of an element
CSS Default Values
CSS Entities padding-top Sets the top padding of an element

@page Customizes the dimension, orientation, and margins of printed pages


CSS Properties
accent-color page-break-after Sets the page-break behavior after an element. Replaced by break-
align-content after property
align-items
page-break-before Sets the page-break behavior before an element. Replaced by break-
align-self
before property
all
animation
animation-delay
animation-direction ❯
 Tutorials  References 
page-break-inside
Exercises  Certificates 
Sets the page-break behavior inside an element. Replaced by break-
inside property
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
paint-order

perspective
Sets the order of how an SVG element or text is painted.

× perspective
Gives a 3D-positioned element some
×
ADVERTIS

CSS Reference
CSS Browser Support perspective-origin Defines at which position the user is looking at the 3D-positioned
element
CSS Selectors
CSS Combinators place-content Specifies align-content and justify-content property values for flexbox
CSS Pseudo-classes and grid layouts
CSS Pseudo-elements
CSS At-rules place-items Specifies align-items and justify-items property values for grid layouts
CSS Functions
place-self Specifies align-self and justify-self property values for grid layouts
CSS Reference Aural
CSS Web Safe Fonts pointer-events Defines whether or not an element reacts to pointer events
CSS Fallback Fonts
position Specifies the type of positioning method used for an element (static,
CSS Animatable
relative, absolute or fixed)
CSS Units
CSS PX-EM Converter @property Defines custom CSS properties directly in the stylesheet without having
CSS Colors to run any JavaScript
CSS Color Values
CSS Default Values
CSS Entities Q
CSS Properties quotes Sets the type of quotation marks for embedded quotations
accent-color
align-content
align-items R
align-self
all resize Defines if (and how) an element is resizable by the user
animation
animation-delay right Specifies the right position of a positioned element
animation-direction ❯
 Tutorials  References  rotate
Exercises  Certificates Specifies the rotation of an element Upgrade Get Certified

row-gap Specifies the gap between the grid rows


HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
×
ADVERTIS

S ×
CSS Reference
CSS Browser Support
scale Specifies the size of an element by scaling up or down
CSS Selectors
CSS Combinators @scope Allows you to select elements in specific DOM subtrees and target
CSS Pseudo-classes elements precisely without writing overly-specific selectors
CSS Pseudo-elements
CSS At-rules scroll-behavior Specifies whether to smoothly animate the scroll position in a scrollable
CSS Functions
box, instead of a straight jump

CSS Reference Aural scroll-margin Specifies the margin between the snap position and the container
CSS Web Safe Fonts
CSS Fallback Fonts scroll-margin-block Specifies the margin between the snap position and the container in the
CSS Animatable block direction
CSS Units
scroll-margin-block-end Specifies the end margin between the snap position and the container in
CSS PX-EM Converter
the block direction
CSS Colors
CSS Color Values scroll-margin-block-start Specifies the start margin between the snap position and the container
CSS Default Values in the block direction
CSS Entities
scroll-margin-bottom Specifies the margin between the snap position on the bottom side and
the container
CSS Properties
accent-color scroll-margin-inline Specifies the margin between the snap position and the container in the
align-content inline direction
align-items
scroll-margin-inline-end Specifies the end margin between the snap position and the container in
align-self
the inline direction
all
animation
animation-delay
animation-direction ❯
 Tutorials  References  scroll-margin-inline-start
Exercises  Certificates Specifies the start margin between the snap position and the Upgrade
in the inline direction
container Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
scroll-margin-left Specifies the margin between the snap position on the left side and the
container
×
×
ADVERTIS

CSS Reference scroll-margin-right Specifies the margin between the snap position on the right side and the
CSS Browser Support container
CSS Selectors
scroll-margin-top Specifies the margin between the snap position on the top side and the
CSS Combinators
container
CSS Pseudo-classes
CSS Pseudo-elements scroll-padding Specifies the distance from the container to the snap position on the
CSS At-rules child elements
CSS Functions
scroll-padding-block Specifies the distance in block direction from the container to the snap
CSS Reference Aural
position on the child elements
CSS Web Safe Fonts
CSS Fallback Fonts scroll-padding-block-end Specifies the distance in block direction from the end of the container to
CSS Animatable the snap position on the child elements
CSS Units
CSS PX-EM Converter scroll-padding-block-start Specifies the distance in block direction from the start of the container to
the snap position on the child elements
CSS Colors
CSS Color Values scroll-padding-bottom Specifies the distance from the bottom of the container to the snap
CSS Default Values position on the child elements
CSS Entities
scroll-padding-inline Specifies the distance in inline direction from the container to the snap
CSS Properties position on the child elements

accent-color scroll-padding-inline-end Specifies the distance in inline direction from the end of the container to
align-content the snap position on the child elements
align-items
align-self scroll-padding-inline-start Specifies the distance in inline direction from the start of the container to
all
the snap position on the child elements

animation
animation-delay
animation-direction ❯
 Tutorials  References  scroll-padding-left
Exercises  Certificates Specifies the distance from the left side of the container to theUpgrade
position on the child elements
snap Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
scroll-padding-right Specifies the distance from the right side of the container to the snap
position on the child elements
×
×
ADVERTIS

CSS Reference scroll-padding-top Specifies the distance from the top of the container to the snap position
CSS Browser Support on the child elements
CSS Selectors
scroll-snap-align Specifies where to position elements when the user stops scrolling
CSS Combinators
CSS Pseudo-classes scroll-snap-stop Specifies scroll behaviour after fast swipe on trackpad or touch screen
CSS Pseudo-elements
CSS At-rules scroll-snap-type Specifies how snap behaviour should be when scrolling
CSS Functions
scrollbar-color Specifies the color of the scrollbar of an element
CSS Reference Aural
CSS Web Safe Fonts shape-outside Defines a shape for wrapping for the inline content
CSS Fallback Fonts
@starting-style Defines an element's starting styles before the element gets its first style
CSS Animatable
update
CSS Units
CSS PX-EM Converter @supports Used to test whether a browser supports a CSS feature
CSS Colors
CSS Color Values
CSS Default Values T
CSS Entities

tab-size Specifies the width of a tab character


CSS Properties
table-layout Defines the algorithm used to lay out table cells, rows, and columns
accent-color
align-content text-align Specifies the horizontal alignment of text
align-items
align-self text-align-last Describes how the last line of a block or a line right before a forced line
all break is aligned when text-align is "justify"
animation
animation-delay
animation-direction ❯
 Tutorials  References 
text-combine-upright
Exercises  Certificates 
Specifies the combination of multiple characters into the space of a
single character
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
text-decoration

text-decoration-color
Specifies the decoration added to text

×
Specifies the color of the text-decoration
×
ADVERTIS

CSS Reference
text-decoration-line Specifies the type of line in a text-decoration
CSS Browser Support
CSS Selectors text-decoration-style Specifies the style of the line in a text decoration
CSS Combinators
CSS Pseudo-classes text-decoration-thickness Specifies the thickness of the decoration line
CSS Pseudo-elements
text-emphasis A shorthand property for the text-emphasis-style and text-emphasis-
CSS At-rules
color properties
CSS Functions
CSS Reference Aural text-emphasis-color Specifies the color of emphasis marks
CSS Web Safe Fonts
text-emphasis-position Specifies the position of emphasis marks
CSS Fallback Fonts
CSS Animatable text-emphasis-style Specifies the style of emphasis marks
CSS Units
CSS PX-EM Converter text-indent Specifies the indentation of the first line in a text-block
CSS Colors
text-justify Specifies the justification method used when text-align is "justify"
CSS Color Values
CSS Default Values text-orientation Defines the orientation of characters in a line
CSS Entities
text-overflow Specifies what should happen when text overflows the containing
element
CSS Properties
accent-color text-shadow Adds shadow to text
align-content
text-transform Controls the capitalization of text
align-items
align-self text-underline-offset Specifies the offset distance of the underline text decoration
all
animation text-underline-position Specifies the position of the underline text decoration
animation-delay
animation-direction ❯
 Tutorials  References 
top
Exercises  Certificates 
Specifies the top position of a positioned element
Upgrade Get Certified

transform Applies a 2D or 3D transformation to an element


HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
transform-origin Allows you to change the position on transformed elements
×
×
ADVERTIS

transform-style Specifies how nested elements are rendered in 3D space


CSS Reference
CSS Browser Support
transition A shorthand property for all the transition-* properties
CSS Selectors
CSS Combinators transition-delay Specifies when the transition effect will start
CSS Pseudo-classes
transition-duration Specifies how many seconds or milliseconds a transition effect takes to
CSS Pseudo-elements
complete
CSS At-rules
CSS Functions transition-property Specifies the name of the CSS property the transition effect is for
CSS Reference Aural
transition-timing-function Specifies the speed curve of the transition effect
CSS Web Safe Fonts
CSS Fallback Fonts translate Specifies the position of an element
CSS Animatable
CSS Units
CSS PX-EM Converter U
CSS Colors
CSS Color Values
unicode-bidi Used together with the direction property to set or return whether the
CSS Default Values
text should be overridden to support multiple languages in the same
CSS Entities document

CSS Properties user-select Specifies whether the text of an element can be selected

accent-color
align-content
align-items
V
align-self
all vertical-align Sets the vertical alignment of an element
animation
visibility Specifies whether or not an element is visible
animation-delay
animation-direction
 Tutorials  W
References  Exercises  Certificates  Upgrade

Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
white-space

widows
Specifies how white-space inside an element is handled

Sets the minimum number of lines×that must be left at the top of a page
×
ADVERTIS

CSS Reference or column


CSS Browser Support
CSS Selectors
width Sets the width of an element

CSS Combinators
word-break Specifies how words should break when reaching the end of a line
CSS Pseudo-classes
CSS Pseudo-elements word-spacing Increases or decreases the space between words in a text
CSS At-rules
word-wrap Allows long, unbreakable words to be broken and wrap to the next line
CSS Functions
CSS Reference Aural writing-mode Specifies whether lines of text are laid out horizontally or vertically
CSS Web Safe Fonts
CSS Fallback Fonts
CSS Animatable Z
CSS Units
CSS PX-EM Converter z-index Sets the stack order of a positioned element
CSS Colors
CSS Color Values zoom Specifies the zoom factor for an element. An element can be zoomed in
CSS Default Values and out
CSS Entities

❮ Home Next ❯
CSS Properties
accent-color
align-content
align-items
align-self
all
animation
animation-delay
animation-direction ADVERTISEMENT

 Tutorials  References  Exercises  Certificates 
ADVERTISEMENT
Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References ×
×
ADVERTIS

CSS Reference
CSS Browser Support
CSS Selectors
CSS Combinators  PLUS SPACES GET CERTIFIED FOR TEACHERS

CSS Pseudo-classes
CSS Pseudo-elements
CSS At-rules
FOR BUSINESS CONTACT US
CSS Functions
CSS Reference Aural
CSS Web Safe Fonts Top Tutorials Top References Top Examples
CSS Fallback Fonts
HTML Tutorial HTML Reference HTML Examples
CSS Animatable CSS Tutorial CSS Reference CSS Examples
JavaScript Tutorial JavaScript Reference JavaScript Examples
CSS Units How To Tutorial SQL Reference How To Examples
CSS PX-EM Converter SQL Tutorial Python Reference SQL Examples
Python Tutorial W3.CSS Reference Python Examples
CSS Colors W3.CSS Tutorial Bootstrap Reference W3.CSS Examples
Bootstrap Tutorial PHP Reference Bootstrap Examples
CSS Color Values PHP Tutorial HTML Colors PHP Examples
Java Tutorial Java Reference Java Examples
CSS Default Values C++ Tutorial Angular Reference XML Examples
CSS Entities jQuery Tutorial jQuery Reference jQuery Examples

Get Certified
CSS Properties HTML Certificate
CSS Certificate
accent-color JavaScript Certificate
align-content Front End Certificate
SQL Certificate
align-items Python Certificate
PHP Certificate
align-self jQuery Certificate
Java Certificate
all
C++ Certificate
animation C# Certificate
XML Certificate
animation-delay
animation-direction ❯
 Tutorials  References  Exercises  Certificates  Upgrade Get Certified

HTML CSS JAVASCRIPT SQL PYTHON JAVA  PHP


  HOW
 TOFORUM
W3.CSS
ABOUT C C++
ACADEMY C# BOOTSTRAP REACT MYSQL JQUERY

References
CSS References
W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning.
×
Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness
×
ADVERTIS

of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.
CSS Reference
Copyright 1999-2025 by Refsnes Data. All Rights Reserved. W3Schools is Powered by W3.CSS.
CSS Browser Support
CSS Selectors
CSS Combinators
CSS Pseudo-classes
CSS Pseudo-elements
CSS At-rules
CSS Functions
CSS Reference Aural
CSS Web Safe Fonts
CSS Fallback Fonts
CSS Animatable
CSS Units
CSS PX-EM Converter
CSS Colors
CSS Color Values
CSS Default Values
CSS Entities

CSS Properties
accent-color
align-content
align-items
align-self
all
animation
animation-delay

You might also like