StandardShorthandProperties

Properties

Link copied to clipboard
abstract var all: All?

The 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 values specified in another cascade layer or stylesheet origin.

Link copied to clipboard
abstract var animation: Animation?

The animation shorthand CSS property applies an animation between styles. It is a shorthand for animation-name, animation-duration, animation-timing-function, animation-delay, animation-iteration-count, animation-direction, animation-fill-mode, and animation-play-state.

Link copied to clipboard

The animation-range CSS shorthand property is used to set the start and end of an animation's attachment range along its timeline, i.e. where along the timeline an animation will start and end.

Link copied to clipboard
abstract var background: Background?

The background shorthand CSS property sets all background style properties at once, such as color, image, origin and size, or repeat method.

Link copied to clipboard

The background-position CSS property sets the initial position for each background image. The position is relative to the position layer set by background-origin.

Link copied to clipboard
abstract var border: Border?

The border shorthand CSS property sets an element's border. It sets the values of border-width, border-style, and border-color.

Link copied to clipboard
abstract var borderBlock: BorderBlock?

The 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.

Link copied to clipboard

The 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.

Link copied to clipboard

The 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.

Link copied to clipboard
abstract var borderBottom: BorderBottom?

The 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.

Link copied to clipboard
abstract var borderColor: BorderColor?

The border-color shorthand CSS property sets the color of an element's border.

Link copied to clipboard
abstract var borderImage: BorderImage?

The border-image CSS property draws an image around a given element. It replaces the element's regular border.

Link copied to clipboard
abstract var borderInline: BorderInline?

The 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.

Link copied to clipboard

The 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.

Link copied to clipboard

The 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.

Link copied to clipboard
abstract var borderLeft: BorderLeft?

The border-left shorthand CSS property sets all the properties of an element's left border.

Link copied to clipboard
abstract var borderRadius: BorderRadius?

The 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.

Link copied to clipboard
abstract var borderRight: BorderRight?

The border-right shorthand CSS property sets all the properties of an element's right border.

Link copied to clipboard
abstract var borderStyle: BorderStyle?

The border-style shorthand CSS property sets the line style for all four sides of an element's border.

Link copied to clipboard
abstract var borderTop: BorderTop?

The border-top shorthand CSS property sets all the properties of an element's top border.

Link copied to clipboard
abstract var borderWidth: BorderWidth?

The border-width shorthand CSS property sets the width of an element's border.

Link copied to clipboard
abstract var caret: Caret?

Syntax: <'caret-color'> || <'caret-shape'>

Link copied to clipboard
abstract var columnRule: ColumnRule?

The column-rule shorthand CSS property sets the width, style, and color of the line drawn between columns in a multi-column layout.

Link copied to clipboard
abstract var columns: Columns?

The columns CSS shorthand property sets the number of columns to use when drawing an element's contents, as well as those columns' widths.

Link copied to clipboard
abstract var container: Container?

The container shorthand CSS property establishes the element as a query container and specifies the name or name for the containment context used in a container query.

Link copied to clipboard

The contain-intrinsic-size CSS shorthand property sets the size of an element that a browser will use for layout when the element is subject to size containment.

Link copied to clipboard
abstract var flex: Flex?

The flex CSS shorthand property sets how a flex item will grow or shrink to fit the space available in its flex container.

Link copied to clipboard
abstract var flexFlow: FlexFlow?

The flex-flow CSS shorthand property specifies the direction of a flex container, as well as its wrapping behavior.

Link copied to clipboard
abstract var font: Font?

The 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.

Link copied to clipboard
abstract var gap: Gap?

The gap CSS property sets the gaps (gutters) between rows and columns. It is a shorthand for row-gap and column-gap.

Link copied to clipboard
abstract var grid: Grid?

The grid CSS property is a shorthand property that sets all of the explicit and implicit grid properties in a single declaration.

Link copied to clipboard
abstract var gridArea: GridArea?

The 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 the edges of its grid area.

Link copied to clipboard
abstract var gridColumn: GridColumn?

The 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 specifying the inline-start and inline-end edge of its grid area.

Link copied to clipboard
abstract var gridRow: GridRow?

The grid-row CSS shorthand property specifies a grid item's size and location within a grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start and inline-end edge of its grid area.

Link copied to clipboard
abstract var gridTemplate: GridTemplate?

The grid-template CSS property is a shorthand property for defining grid columns, grid rows, and grid areas.

Link copied to clipboard
abstract var inset: Inset?

The inset CSS property is a shorthand that corresponds to the top, right, bottom, and/or left properties. It has the same multi-value syntax of the margin shorthand.

Link copied to clipboard
abstract var insetBlock: InsetBlock?

The inset-block CSS property defines the logical block start and end offsets of an element, which maps to physical offsets depending on the element's writing mode, directionality, and text orientation. It corresponds to the top and bottom, or right and left properties depending on the values defined for writing-mode, direction, and text-orientation.

Link copied to clipboard
abstract var insetInline: InsetInline?

The inset-inline CSS property defines the logical start and end offsets of an element in the inline direction, which maps to physical offsets depending on the element's writing mode, directionality, and text orientation. It corresponds to the top and bottom, or right and left properties depending on the values defined for writing-mode, direction, and text-orientation.

Link copied to clipboard
abstract var lineClamp: LineClamp?

Syntax: none | <integer>

Link copied to clipboard
abstract var listStyle: ListStyle?

The list-style CSS shorthand property allows you to set all the list style properties at once.

Link copied to clipboard
abstract var margin: Margin?

The margin CSS shorthand property sets the margin area on all four sides of an element.

Link copied to clipboard
abstract var marginBlock: MarginBlock?

The margin-block CSS shorthand property defines the logical block start and end margins of an element, which maps to physical margins depending on the element's writing mode, directionality, and text orientation.

Link copied to clipboard
abstract var marginInline: MarginInline?

The margin-inline CSS shorthand property is a shorthand property that defines both the logical inline start and end margins of an element, which maps to physical margins depending on the element's writing mode, directionality, and text orientation.

Link copied to clipboard
abstract var mask: Mask?

The mask CSS shorthand property hides an element (partially or fully) by masking or clipping the image at specific points.

Link copied to clipboard
abstract var maskBorder: MaskBorder?

The mask-border CSS shorthand property lets you create a mask along the edge of an element's border.

Link copied to clipboard
abstract var motion: Offset?

The offset CSS shorthand property sets all the properties required for animating an element along a defined path.

Link copied to clipboard
abstract var offset: Offset?

The offset CSS shorthand property sets all the properties required for animating an element along a defined path.

Link copied to clipboard
abstract var outline: Outline?

The outline CSS shorthand property sets most of the outline properties in a single declaration.

Link copied to clipboard
abstract var overflow: Overflow?

The 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 directions.

Link copied to clipboard

The overscroll-behavior CSS property sets what a browser does when reaching the boundary of a scrolling area. It's a shorthand for overscroll-behavior-x and overscroll-behavior-y.

Link copied to clipboard
abstract var padding: Padding?

The padding CSS shorthand property sets the padding area on all four sides of an element at once.

Link copied to clipboard
abstract var paddingBlock: PaddingBlock?

The padding-block CSS shorthand property defines the logical block start and end padding of an element, which maps to physical padding properties depending on the element's writing mode, directionality, and text orientation.

Link copied to clipboard

The padding-inline CSS shorthand property defines the logical inline start and end padding of an element, which maps to physical padding properties depending on the element's writing mode, directionality, and text orientation.

Link copied to clipboard
abstract var placeContent: PlaceContent?

The 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 relevant layout system such as Grid or Flexbox.

Link copied to clipboard
abstract var placeItems: PlaceItems?

The 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 system such as Grid or Flexbox. If the second value is not set, the first value is also used for it.

Link copied to clipboard
abstract var placeSelf: PlaceSelf?

The 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 layout system such as Grid or Flexbox. If the second value is not present, the first value is also used for it.

Link copied to clipboard
abstract var scrollMargin: ScrollMargin?

The 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.

Link copied to clipboard

The scroll-margin-block shorthand property sets the scroll margins of an element in the block dimension.

Link copied to clipboard

The scroll-margin-inline shorthand property sets the scroll margins of an element in the inline dimension.

Link copied to clipboard

The 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.

Link copied to clipboard

The scroll-padding-block shorthand property sets the scroll padding of an element in the block dimension.

Link copied to clipboard

The scroll-padding-inline shorthand property sets the scroll padding of an element in the inline dimension.

Link copied to clipboard

The 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.

Link copied to clipboard

The scroll-timeline CSS shorthand property defines a name that can be used to identify the source element of a scroll timeline, along with the scrollbar axis that should provide the timeline.

Link copied to clipboard

The 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 the newer text-decoration-thickness property.

Link copied to clipboard
abstract var textEmphasis: TextEmphasis?

The 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.

Link copied to clipboard
abstract var transition: Transition?

The transition CSS property is a shorthand property for transition-property, transition-duration, transition-timing-function, and transition-delay.

Link copied to clipboard
abstract var viewTimeline: ViewTimeline?

The view-timeline CSS shorthand property is used to define a named view progress timeline, which is progressed through based on the change in visibility of an element (known as the subject) inside a scrollable element (scroller). view-timeline is set on the subject.