CSS Properties Complete Reference

PreviousNext

CSS propertiesare individual attributes for the web design to define the style and appearance ofHTML elements.

ThisCSS referenceprovides thecomplete guide to all CSS propertieswith examples. You can practice the example by clicking on the “Try It” button.

Search CSS Properties

All CSS Propetries

Following is the list of all CSS properties arranged alphabetically.

A

PropertyDescriptionExampleaccent-colorSets a highlight color for controls on user interfaces.Try Italign-contentSpecifies how the flex lines are distributed inside a flex container along it’s cross-axis or grid’s block-axis.Try Italign-itemsDescribes how objects inside a flexible container should be aligned.Try Italign-selfDefines how selected objects inside a flexible container should be aligned.Try ItallResets all the properties except unicode-bidi and direction.Try ItanimationApplies animation between styles. Shorthand for all the animation properties.Try Itanimation-delayDefines a pause before an animation begins.Try Itanimation-directionSpecifies whether an animation should play in reverse, forward, or alternating cycles.Try Itanimation-durationIndicates the amount of time an animation should take to finish one cycle.Try Itanimation-fill-modeDefines the styles to be applied on the target element before and after the animation.Try Itanimation-iteration-countDefines how many times an animation should be played.Try Itanimation-nameGives the @keyframes animation a name.Try Itanimation-play-stateSpecifies whether an animation is running or paused.Try Itanimation-timing-functionGives an animation’s speed curve specifications.Try Itaspect-ratioDefines an element’s desired aspect ratio.Try It

B

PropertyDescriptionExamplebackdrop-filterDefines a visual impact on the space behind an element.Try Itbackface-visibilitySpecifies whether an element’s back face should be revealed when facing the user.Try ItbackgroundShorthand for background related properties.Try Itbackground-attachmentSpecifies the position of the background relative to the viewport, either fixed or scrollable.Try Itbackground-clipControls how far a background image extends beyond the element’s padding or content box.Try Itbackground-colorSets the background color of an element.Try Itbackground-imageSets one or more background image(s) on an element.Try Itbackground-originSets the origin of the background.Try Itbackground-positionSets the initial position of each image in a background.Try Itbackground-position-xSets the initial horizontal position of each image in a background.Try Itbackground-position-ySets the initial vertical position of each image in a background.Try Itbackground-repeatControls the repetition of an image in the background.Try Itbackground-sizeControls the size of the background image.Try Itbackground-blend-modeDetermines how an element’s background images blend with each other.Try ItborderSets the border of an element.Try Itborder-blockShorthand for setting the logical block border property values.Try Itborder-block-colorDefines the color of the borders in the block direction (top and bottom).Try Itborder-block-endShorthand property for setting the logical block end border properties.Try Itborder-block-end-colorDefines the color of the logical block-end border of an element.Try Itborder-block-end-styleDefines the style of the logical block-end border of an element.Try Itborder-block-end-widthDefines the width of the logical block-end border of an element.Try Itborder-block-startShorthand property for setting the logical block-start border properties.Try Itborder-block-start-colorDefines the color of the logical block-start border of an element.Try Itborder-block-start-styleDefines the style of the logical block start border of an element.Try Itborder-block-start-widthDefines the width of the logical block-start border of an element.Try Itborder-block-styleDefines the style of the top and bottom block borders of an element.Try Itborder-block-widthDefines the width of the top and bottom block borders of an element.Try Itborder-bottomShorthand property sets the element’s bottom border.Try Itborder-bottom-colorSets the color of an element’s bottom border.Try Itborder-bottom-left-radiusRounds the bottom-left corner of an element.Try Itborder-bottom-right-radiusRounds the bottom-right corner of an element.Try Itborder-bottom-styleSets the style of the bottom border.Try Itborder-bottom-widthSets the width of the bottom border.Try Itborder-collapseSpecifies whether the borders of a table should be divided or collapsed into a single border.Try Itborder-colorSets the color of the border(s).Try Itborder-end-end-radiusDefines a bottom-right border radius on an element.Try Itborder-end-start-radiusDefines a bottom-left border radius on an element.Try Itborder-imageSets an image as border to an element.Try Itborder-image-outsetDefines how much of the border image area goes outside of the border box.Try Itborder-image-repeatSpecifies whether the border image should be stretched, rounded, or repeated.Try Itborder-image-sliceDivides the border image into regions.Try Itborder-image-sourceDefines the path to the image that will be used as the border.Try Itborder-image-widthSets the width of the border image.Try Itborder-inlineShorthand property for setting the individual logical inline border property values.Try Itborder-inline-colorDefines the color of the logical inline borders of an element.Try Itborder-inline-endShorthand property for setting the logical inline-end border property values.Try Itborder-inline-end-colorSets the color of the logical inline-end border. (right border)Try Itborder-inline-end-styleSets the style of the logical inline-end border. (right border)Try Itborder-inline-end-widthSets the width of the logical inline-end border. (right border)Try Itborder-inline-startShorthand property for setting the logical inline-start border (left border) property values.Try Itborder-inline-start-colorSets the color of the inline-start border (left border).Try Itborder-inline-start-styleSets the style of the logical inline-start border (left border).Try Itborder-inline-start-widthSets the width of the logical inline-start border (left border).Try Itborder-inline-styleDefines the style of the left and right inline borders of an element.Try Itborder-inline-widthDefines the width of the left and right inline borders of an element.Try Itborder-leftShorthand for setting all the properties of the left border of an element.Try Itborder-left-colorDefines the color of the left border of an element.Try Itborder-left-styleDefines the style of the left border of an element.Try Itborder-left-widthDefines the width of the left border of an element.Try Itborder-radiusRounds the corners of an element’s outer border edge.Try Itborder-rightShorthand for setting all the properties of the right border of an element.Try Itborder-right-colorDefines the color of the right border of an element.Try Itborder-right-styleDefines the style of the right border of an element.Try Itborder-right-widthDefines the width of the right border of an element.Try Itborder-spacingDefines a distance between borders of adjacent cells in a table.Try Itborder-start-end-radiusDefines a top-right border radius on an element, between the block-start and inline-end sides.Try Itborder-start-start-radiusDefines a top-left border radius on an element, between the block-start and inline-start sides.Try Itborder-styleSets the line style for all four sides of an element’s border.Try Itborder-topShorthand property setting all the properties of the top border of an element.Try Itborder-top-colorDefines the color of the top border.Try Itborder-top-left-radiusSets the roundness of the top-left corner of an element’s border.Try Itborder-top-right-radiusRounds the top-right corner of an element.Try Itborder-top-styleSets the line style of top border of an element.Try Itborder-top-widthSets the width of top border of an element.Try Itborder-widthSets the width of an element’s border.Try ItbottomSets the vertical position of an element.Try Itbox-decoration-breakDefines how an element’s border and background will behave during page breaks or, in the case of inline elements, at line breaks.Try Itbox-shadowAdds a shadow effect around an element.Try Itbox-sizingSets the way, the total width and height of an element is calculated.Try Itbreak-afterDefines whether the given element should be followed by a page, column, or region break.Try Itbreak-beforeDefines whether a region, page, or column break should come before the given element.Try Itbreak-insideDefines if the given element should have a page, column, or region break inside of it.Try It

C

PropertyDescriptionExamplecaption-sideDefines where a table caption should be positioned.Try Itcaret-colorDefines the color of the editable cursor (caret) in text areas, input fields, and other elements.Try It@charsetProvides details about the character encoding that the style sheet uses.Try ItclearDefines the behavior of the element next to a floating element.Try ItclipClips an element that is precisely positioned.Try Itclip-pathCreates a clipping region that sets the part of the element to be shown.Try ItcolorDefines the foreground color of a text.Try Itcolumn-countDefines the number of columns into which an element should be divided.Try Itcolumn-fillControls an element’s contents and break it into columns.Try Itcolumn-gapDefines the size of the gap that exists between the columns in a multi-column layout..Try Itcolumn-ruleShorthand property that sets the color, style, and width of the line drawn between columns in a multi-column layout.Try Itcolumn-rule-colorSets the color of the line drawn between columns in a multi-column layout.Try Itcolumn-rule-styleSets the style of the line drawn between columns in a multi-column layout.Try Itcolumn-rule-widthSets the width of the line drawn between columns in a multi-column layout.Try Itcolumn-spanDefines whether an element should span across one column or all columns, in a multi-column layout.Try Itcolumn-widthSets the column width in a multi-column layout.Try ItcolumnsShorthand property for setting the width and count of columns.Try ItcontentReplaces content with a generated value.Try Itcounter-incrementUsed to increase or decrease the value of named CSS counters.Try Itcounter-resetCreates named CSS counters and initializes a specific value to them.Try Itcounter-setSets a given value to a CSS counter.Try ItcursorDefines the mouse pointer that will be displayed when pointing at an item.Try It

D

PropertyDescriptionExampledirectionSets the direction of the text, table columns, and horizontal overflow.Try ItdisplayDefines the display method for a certain HTML element.Try It

E

PropertyDescriptionExampleempty-cellsDefines whether borders and backgrounds to be shown on empty cells in a table.Try It

F

PropertyDescriptionExamplefilterApplies graphical effects to an element.Try ItflexShorthand property that sets whether a flex item will grow or shrink.Try Itflex-basisCSS flex-basis property sets the initial size of a flex item on the main axis before distributing the remaining space among the flex itemsTry Itflex-directionCSS flex-direction property determines the direction in which flex items are placed within a flex container. ( horizontal and vertical )Try Itflex-flowShorthand property for specifying the direction and wrapping behavior of a flex container.Try Itflex-growDetermines how much extra space a flex item should take up in the flex container along its main axis.Try Itflex-shrinkDefines the shrinking of the item in relation to the others.Try Itflex-wrapCSS flex-wrap property determines whether flex items should remain on a single line or are allowed to wrap onto multiple lines depending on the availability of space.Try ItfloatPlaces an element on left or right side of its container.Try ItfontShorthand property for setting all the font related properties.Try Itfont-familyDefines the text’s font family.Try Itfont-feature-settingsUsed to enable or disable specific OpenType font features, which control how text is rendered using advanced font features like ligatures, kerning, stylistic setsTry Itfont-kerningDetermines how the kerning information, the spacing between letters, is used.Try Itfont-language-overrideUsed to adjusting the rendering of glyphs and features to match the linguistic needs of different languages.Try Itfont-sizeDetermines the font size of the text.Try Itfont-size-adjustPreserves text readability in the event of a font fallback.Try Itfont-stretchSelects the standard, condensed, or expanded face of a font.Try Itfont-styleSets the text’s font style.Try Itfont-synthesisDetermines whether or not the browser should synthesize a style that are missing in a font-family.Try Itfont-variantSets all the font variants for a font.Try Itfont-variant-alternateControls the use of alternate glyphs.Try Itfont-variant-capsControls the use of alternate glyphs used for small capitals.Try Itfont-variant-east-asianRegulates the use of alternate glyphs for East Asian scripts, such as Chinese and Japanese.Try Itfont-variant-ligaturesRegulates the usage of contextual forms and ligatures.Try Itfont-variant-numericRegulates the use of different glyphs for ordinal markers, fractions, and integers.Try Itfont-variant-positionRegulates the use of smaller alternate glyphs that are positioned as superscript or subscript.Try Itfont-weightSpecifies the weight of a font.Try It

G

PropertyDescriptionExamplegapShorthand property that sets the gaps for the rows and columns in grid layout system (Also used to add gaps in multi-column layout of texts).Try ItgridShorthand property for setting all grid related properties in one declaration.Try Itgrid-areaShorthand property specifying the grid item’s size and location inside a grid.Try Itgrid-auto-columnsDefines the default size of a column.Try Itgrid-auto-flowDefines the grid’s auto-placed item insertion process.Try Itgrid-auto-rowsDefines the default row size.Try Itgrid-columnShorthand property specifying the grid item’s size and location inside a grid column.Try Itgrid-column-endDefines the end point of the grid item within grid column.Try Itgrid-column-startDefines the start point of the grid item within grid column.Try Itgrid-rowShorthand property specifying the grid item’s size and location inside a grid row.Try Itgrid-row-endSpecifies the end point of grid item within grid row.Try Itgrid-row-gapDefines the gap between rows in terms of size.Try Itgrid-row-startSpecifies the start point of grid item within grid row.Try Itgrid-templateShorthand property specifying properties related to grid columns, grid rows and grid areas.Try Itgrid-template-areasDefines named grid items and their use in displaying columns and rows.Try Itgrid-template-columnsDefines the number of and what size columns are there in a grid layout.Try Itgrid-template-rowsDefines the size of the rows in a grid layout.Try It

H

PropertyDescriptionExampleheightDefines an element’s height.Try IthyphensDefines how to divide words to enhance text layout.Try Ithyphenate-characterUsed to change default hyphenation character (-).Try It

I

PropertyDescriptionExampleimage-renderingDefines the kind of image scaling approach to be used.Try Itinline-sizeDefines the horizontal and vertical size of an element’s block.Try ItinsetIndicates the distance an element is from edges of its parent element.Try Itinset-blockDefines the logical block start and end offsets of an element.Try Itinset-block-endDefines the logical block end offsets of an element.Try Itinset-block-startDefines the logical block start offsets of an element.Try Itinset-inlineDefines the logical start and end offsets of an element in the inline direction.Try Itinset-inline-endDefines the distance, measured in the inline direction, between an element’s end and its parent element.Try Itinset-inline-startDefines the distance, measured in the inline direction, between an element’s start and it’s parent element.Try ItisolationDefines if a new stacking content must be created by an element.Try It

J

PropertyDescriptionExamplejustify-contentDefines how space is distributed between and around content items in a flex and grid container.Try Itjustify-itemsDefines how grid elements should be aligned along the horizontal axis within a grid container.Try Itjustify-selfDefines how a grid item should be aligned in the inline direction that resides within a grid container.Try It@keyframesDefines a set of keyframes for animations or transitions.Try It

L

PropertyDescriptionExampleleftDefines the horizontal position of an element.Try Itletter-spacingSets the horizontal spacing between text characters.Try Itline-breakDefines if and how to break lines of East Asian scripts.Try Itline-heightDefines the height of a line box.Try Itlist-styleShorthand property to set all the list style properties in single declaration.Try Itlist-style-imageSets an image as the list item marker.Try Itlist-style-positionSets the position of the marker in a list.Try Itlist-style-typeDefines the kind of list item marker.Try It

M

PropertyDescriptionExamplemarginShorthand property to set the margins on all four sides of an element.Try Itmargin-blockShorthand property defining the logical block start and end margins for an element.Try Itmargin-block-endSets the margin space at the end of an element in the block direction.Try Itmargin-block-startSets the margin space at the start of an element in the block direction.Try Itmargin-bottomSets the margin area on the bottom of an element.Try Itmargin-inlineDefines the logical inline start and end margins of an element.Try Itmargin-inline-endDefines the logical inline end margin of an element.Try Itmargin-inline-startDefines the logical inline start margin of an element.Try Itmargin-leftSets the margin area on the left side of an element.Try Itmargin-rightSets the margin area on the right side of an element.Try Itmargin-topSets the margin on the top side of an element.Try ItmaskMasks or clips the image at particular points to hide an element (partially or completely).Try Itmask-clipDetermines the area covered by a mask.Try Itmask-compositeDisplays the mask layers that are below the current mask layer after a compositing operation is performed.Try Itmask-imageSets an image to be used as an element’s mask layer.Try Itmask-modeDefines whether the mask reference given by mask-image should be considered as a luminance or alpha mask.Try Itmask-originDefines the origin of the mask image.Try Itmask-positionDefines the positioning of a mask image within an element.Try Itmask-repeatDefines how a mask image should be repeated within an element.Try Itmask-sizeDefines the size of a mask image applied to an element using the mask-image property.Try Itmask-typeSets an SVG <mask> element as a luminance or an alpha mask.Try Itmax-heightSets an maximum height for an element to occupy in layout.Try Itmax-widthSets an maximum width for an element to occupy in layout.Try It@mediaSets CSS style rules for specific media types, devices, and sizes.Try Itmax-block-sizeSets the maximum size of an element in the opposite direction to its writing direction.Try Itmax-inline-sizeDefines the horizontal or vertical maximum size of an element’s block.Try Itmin-block-sizeSets the minimum size, either horizontally or vertically of an element’s block based on its writing mode.Try Itmin-inline-sizeDefines the minimum horizontal or vertical size of an element’s block.Try Itmin-heightSets a lower bound on the height of an element.Try Itmin-widthSets a lower bound on the width of an element.Try Itmix-blend-modeDefines how the element’s content should blend with the content of its parent and the element’s background.Try It

O

PropertyDescriptionExampleobject-fitDefines how an image or video should be resized or cropped to fit within its container.Try Itobject-positionDefines the position of the content inside an element that has a defined size.Try ItoffsetShorthand property that makes used to position elements in container.Try Itoffset-anchorDefines the moving position of an element inside a box traveling along an offset-path.Try Itoffset-distanceDefines the position along an offset-path where an element should be placed.Try Itoffset-pathDefines an element’s path inside its parent container or SVG coordinate system.Try Itoffset-rotateDefines the orientation or direction of an element as it moves along the specified offset-path.Try ItopacitySets the transparency of an element.Try ItorderDefines the order in which flex items appear within a flex container.Try ItorphansDefines the minimum number of lines required at the bottom of a page, region, or column to prevent a break.Try ItoutlineSets the width, color, and style of an outline around an element. The outline is used to highlight an element when focused.Try Itoutline-colorSets the color of an outline around an element.Try Itoutline-offsetDefines the space between an outline and the border edge of an element.Try Itoutline-styleDetermines the style of an outline around an element.Try Itoutline-widthDefines the width of the outline around an element.Try ItoverflowDefines how to handle content that overflows the boundaries of its container.Try Itoverflow-anchorProvides a way to disable the browser’s scroll anchoring behavior, which adjusts scroll position to reduce content shifting.Try Itoverflow-wrapAllows the browser to split a line of text into an unbreakable string to keep the content from overflowing its container.Try Itoverflow-clip-marginDefines the distance that content can overflow the element’s box before being clipped.Try Itoverflow-xDefines that an element’s content will overflow to its left and right margins, as well as horizontally.Try Itoverflow-yDefines how the content of a block-level element is displayed when it exceeds the element’s top and bottom edges.Try Itoverflow-blockDefines how the content of an element behaves when it exceeds the left and right boundaries of its box.Try Itoverflow-inlineDefines how overflowing content is displayed when it overflows the inline edges of an element.Try Itoverscroll-behaviorDetermines what a browser does when the boundary of a scrolling area is reached.Try Itoverscroll-behavior-blockDetermines how the browser behaves when the block direction border of a scrolling region is reached.Try Itoverscroll-behavior-inlineDetermines how the browser behaves when the inline direction border of a scrolling region is reached.Try Itoverscroll-behavior-xDetermines what a browser does when the horizontal boundary of a scrolling area is reached.Try Itoverscroll-behavior-yDetermines what a browser does when the vertical boundary of a scrolling area is reached.Try It

P

PropertyDescriptionExamplepaddingShorthand property that defines the padding for all sides of an element.Try Itpadding-blockDetermines the logical block start and end padding of an element.Try Itpadding-block-endDetermines the logical block end padding of an element.Try Itpadding-block-startSets the width of the padding on the bottom of an element.Try Itpadding-bottomSets the width of the padding on the bottom of an element.Try Itpadding-inlineDetermines the logical inline start and end padding of an element.Try Itpadding-inline-endDetermines the logical inline end padding of an element.Try Itpadding-inline-startDetermines the logical inline start padding of an element.Try Itpadding-leftSets the padding space on the left side of an element.Try Itpadding-rightSets the padding space on the right side of an element.Try Itpadding-topSets the padding space on the top side of an element.Try ItperspectiveDefines the distance between the z=0 plane and the user.Try Itperspective-originDefines the position at which viewer / user is looking.Try Itplace-contentAligns content in both the block (column) and inline (row) axes simultaneously. It’s shorthand for align-content and justify-content properties.Try Itplace-itemsAligns the items within the grid and flexbox container along both the block (column) and inline (row) axes. It’s shorthand for align-items and justify-items properties.Try Itplace-selfAligns the individual items in both block and inline directions simultaneously. It’s shorthand for align-self and justify-self properties.Try Itpointer-eventsDetermines whether or not an element receive pointer events.Try ItpositionDefines the position of an element on a web page.Try It

Q

PropertyDescriptionExamplequotesDefines the style of quotation marks to be used for embedded quotes.Try It

R

PropertyDescriptionExampleresizeDefines if and how a user can resize an element.Try ItrightControls the horizontal position of an elementTry ItrotateDefines the way an element rotates.Try Itrow-gapDefines the gap between the grid rows. Also used to add gap between columns in multi-column layout.Try It

S

PropertyDescriptionExamplescaleSpecifies the scale transformation of elements, independent of transform property.Try Itscroll-behaviorDefines how smoothly the browser scrolls when a user clicks on a link or uses the scroll bar.Try Itscroll-marginDefines the margin of an element within the snap area.Try Itscroll-margin-blockShorthand property that defines the margin of the scroll snap area at the block axis.Try Itscroll-margin-block-endDefines the margin of the scroll snap area at the end of the block axis.Try Itscroll-margin-block-startDefines the margin of the scroll snap area at the start of the block axis.Try Itscroll-margin-bottomDefines the margin at the bottom of a scrolling container.Try Itscroll-margin-inlineSets the scroll margin of an element in the line (horizontal axis) dimension.Try Itscroll-margin-inline-endDefines the margin for the scroll snap region at the end of the horizontal dimension.Try Itscroll-margin-inline-startDefines the margin for the scroll snap area at the start of the horizontal dimension.Try Itscroll-margin-leftDefines the left margin of the scroll snap area of an element.Try Itscroll-margin-topDefines the top margin of the scroll snap area of an element.Try Itscroll-margin-rightDefines the right margin of the scroll snap area of an element.Try Itscroll-paddingDefines the scroll padding between the edge of the scroll container and the area of an element that snaps into place once scrolling stops.Try Itscroll-padding-blockDefines the scroll padding of an element in the block dimension.Try Itscroll-padding-block-startDefines the offsets for the start edge of the scroll padding of an element in the block dimension.Try Itscroll-padding-block-endDefines the offsets for the end edge of the scroll padding of an element in the block dimension.Try Itscroll-padding-bottomDefines the bottom offset of the scroll snap area of an element.Try Itscroll-padding-leftDefines the amount of space between the left edge of the scroll container and the scroll snap area of an element.Try Itscroll-padding-rightDefines the amount of space between the right edge of the scroll container and the scroll snap area of an element.Try Itscroll-padding-topDefines the top offset of the scroll snap area of an element.Try Itscroll-padding-inlineDefines the scroll padding of an element in the inline dimension.Try Itscroll-padding-inline-startDefines the offsets for the start edge of the scrollport, in the inline dimension.Try Itscroll-padding-inline-endDefines the offsets for the end edge of the scrollport, in the inline dimension.Try Itscroll-snap-alignDefines how a snapped element is positioned within its snap container.Try Itscroll-snap-shotDetermines whether the scroll container will scroll past or stick to the nearest snap positions.Try Itscroll-snap-typeDefines how the scroll container snaps to snap positions.Try Itscrollbar-colorDefines the color of the scrollbar track and thumb.Try Itscrollbar-widthUsed to style the width of scrollbar track and thumb.Try Itscrollbar-gutterIt helps to create a fixed space for the scrollbar.Try Itshape-image-thresholdSpecifies the alpha channel threshold for shape extraction when using an image with the shape-outside property.Try Itshape-marginDefines the margin around a specified CSS shape.Try Itshape-outsideDefines a shape around which inline content should wrap.Try It

T

PropertyDescriptionExampletab-sizeDefines the width of tab characters within an element.Try Ittable-layoutDefines the way the <table> cells, rows, and columns are displayed.Try Ittext-alignDefines the alignment of the text with the margin of the page.Try Ittext-align-lastSets the way the last line of a block or a line, just before a forced line break, is aligned.Try Ittext-combine-uprightDefines how to fit several characters into a single character’s area.Try Ittext-decorationDefines the decoration added to text.Try Ittext-decoration-colorDefines the color of the text decoration.Try Ittext-decoration-lineUsed to add a decoration line to the text.Try Ittext-decoration-styleUsed to add style to the text decoration line.Try Ittext-decoration-thicknessUsed to add thickness to the text decoration line.Try Ittext-emphasisShorthand property that is used to add emphasis to text.Try Ittext-emphasis-colorUsed to set the color of the emphasis marks around a text.Try Ittext-emphasis-positionUsed to set the position of the emphasis mark around a text.Try Ittext-emphasis-styleDefines the appearance of emphasis marks.Try Ittext-indentDefines the indentation of the first line of the text.Try Ittext-justifySpecifies the justification method of text when text-align is set to “justify”.Try Ittext-orientationDefines the orientation of text characters in a line.Try Ittext-overflowControls how hidden overflow content is displayed to users.Try Ittext-shadowUsed to add a shadow effect to text.Try Ittext-transformChange the appearance of text by transforming it in various ways.Try Ittext-underline-offsetDefines the distance of an underline text decoration line from its initial position.Try Ittext-underline-positionDefines where the underlining text decoration should be positioned.Try IttopDefines vertical position of an element relative to its containing element.Try IttransformIt is useful in rotation, scaling, skewing, or translation of an element.Try Ittransform-boxDefines the layout box to which transformation properties relate.Try Ittransform-originHelps in setting the origin for the transformation of an element.Try Ittransform-styleDefines the 3D space rendering of nested items.Try IttransitionA property that works as a shorthand for every transition property.Try Ittransition-delayDefines the amount of time to wait before starting a transition effectTry Ittransition-durationDefines the amount of time that a transition animation should take to complete.Try Ittransition-propertyDefines which CSS properties should have a transition effect applied.Try Ittransition-timing-functionDefines the transition effect’s speed curve.Try IttranslateAllows you to move an element along the X, Y, and Z axes.Try It

U

PropertyDescriptionExampleunicode-bidiControls how bidirectional text is displayed in a document.Try Ituser-selectDetermines if text can be selected by the user.Try It

V

PropertyDescriptionExamplevertical-alignDefines an element’s vertical alignment.Try ItvisibilityDefines if an element needs to be shown or hidden without changing the layout of a document.Try It

W

PropertyDescriptionExamplewhite-spaceDefines the white space flow inside the text in an element.Try ItwidowsDefines how many lines a page or column must have left at the top.Try ItwidthDefines the width of an element’s content area.Try Itword-breakDefines how words should be broken or wrapped in case they exceed the available width of an element.Try Itword-spacingDefines the space between the words in a text.Try Itwriting-modeDefines if text should be displayed vertically or horizontally.Try It

Z

PropertyDescriptionExamplez-indexControls the stacking order of elements in web page.Try ItNo results found