Found 990 pages:
# | Page | Tags and summary |
---|---|---|
1 | CSS: Cascading Style Sheets | CSS, Cascading Style Sheets, Design, Landing, Layout, Reference, Style Sheets, Styles, Stylesheets, l10n:priority |
Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in HTML | ||
2 | -moz-binding | CSS, CSS Property, CSS:Mozilla Extensions, Deprecated, Mozilla, Non-standard, Reference, XBL, XUL |
The -moz-binding CSS property is used by Mozilla-based applications to attach an XBL binding to a DOM element. |
||
3 | -moz-border-bottom-colors | CSS, CSS Property, Non-standard, Obsolete, Reference |
In Mozilla applications like Firefox, the -moz-border-bottom-colors CSS property sets a list of colors for the bottom border. |
||
4 | -moz-border-left-colors | CSS, CSS Property, Non-standard, Obsolete, Reference |
In Mozilla applications like Firefox, the -moz-border-left-colors CSS property sets a list of colors for the left border. |
||
5 | -moz-border-right-colors | CSS, CSS Property, CSS:Mozilla Extensions, Non-standard, Obsolete, Reference |
In Mozilla applications like Firefox, the -moz-border-right-colors CSS property sets a list of colors for the right border. |
||
6 | -moz-border-top-colors | CSS, CSS Property, CSS:Mozilla Extensions, Non-standard, Obsolete, Reference |
In Mozilla applications like Firefox, the -moz-border-top-colors CSS property sets a list of colors for the top border. |
||
7 | -moz-box-ordinal-group | CSS, CSS:Mozilla Extensions, Flexible Box, Non-standard, Reference |
Indicates the ordinal group the element belongs to. Elements with a lower ordinal group are displayed before those with a higher ordinal group. | ||
8 | -moz-cell | CSS, CSS Value, Deprecated, Reference |
Don't use this value! Use the cursor value cell instead. |
||
9 | -moz-context-properties | -moz-context-properties, CSS, CSS Property, CSS:Mozilla Extensions, Experimental, Needs Privileges, Non-standard, Reference |
If you reference an SVG image in a webpage (such as with the <img> element or as a background image), the SVG image can coordinate with the embedding element (its context) to have the image adopt property values set on the embedding element. To do this the embedding element needs to list the properties that are to be made available to the image by listing them as values of the -moz-context-properties property, and the image needs to opt in to using those properties by using values such as the context-fill value. |
||
10 | -moz-float-edge | CSS, CSS Property, CSS:Mozilla Extensions, Layout, NeedsCompatTable, Non-standard |
The non-standard -moz-float-edge CSS property specifies whether the height and width properties of the element include the margin, border, or padding thickness. |
||
11 | -moz-force-broken-image-icon | CSS, NeedsCompatTable, Non-standard, Reference |
The -moz-force-broken-image-icon extended CSS property can be used to force the broken image icon to be shown even when a broken image has an alt attribute. |
||
12 | -moz-image-rect | CSS, CSS Function, CSS Images, CSS:Mozilla Extensions, Non-standard, Reference |
The -moz-image-rect value for CSS background-image lets you use a portion of a larger image as a background. This allows you to, for example, use different parts of one larger image as backgrounds in different parts of your content. |
||
13 | -moz-image-region | CSS, CSS Property, CSS:Mozilla Extensions, Non-standard, Reference |
For certain XUL elements and pseudo-elements that use an image from the list-style-image property, this property specifies a region of the image that is used in place of the whole image. This allows elements to use different pieces of the same image to improve performance. |
||
14 | -moz-orient | CSS, CSS Property, Non-standard, Reference |
The -moz-orient CSS property specifies the orientation of the element to which it's applied. |
||
15 | -moz-outline-radius | CSS, CSS Property, CSS:Mozilla Extensions, Non-standard, Reference |
In Mozilla applications like Firefox, the -moz-outline-radius CSS property can be used to give an element's outline rounded corners. |
||
16 | -moz-outline-radius-bottomleft | CSS, CSS Property, NeedsCompatTable, NeedsContent, Non-standard, Reference |
In Mozilla applications, the -moz-outline-radius-bottomleft CSS property can be used to round the bottom-left corner of an element's outline . |
||
17 | -moz-outline-radius-bottomright | CSS, CSS Property, NeedsCompatTable, NeedsContent, Non-standard, Reference |
In Mozilla applications, the -moz-outline-radius-bottomright CSS property can be used to round the bottom-right corner of an element's outline . |
||
18 | -moz-outline-radius-topleft | CSS, CSS Property, NeedsCompatTable, NeedsContent, Non-standard, Reference |
In Mozilla applications, the -moz-outline-radius-topleft CSS property can be used to round the top-left corner of an element's outline . |
||
19 | -moz-outline-radius-topright | CSS, CSS Property, NeedsCompatTable, NeedsContent, Non-standard, Reference |
In Mozilla applications, the -moz-outline-radius-topright CSS property can be used to round the top-right corner of an element's outline . |
||
20 | -moz-stack-sizing | CSS, CSS Property, NeedsCompatTable, Non-standard, Reference, XUL |
-moz-stack-sizing is an extended CSS property. Normally, a stack will change its size so that all of its child elements are completely visible. For example, moving a child of the stack far to the right will widen the stack so the child remains visible. |
||
21 | -moz-text-blink | CSS, CSS Property, CSS:Mozilla Extensions, Non-standard, Obsolete, Reference |
The -moz-text-blink non-standard Mozilla CSS extension specifies the blink mode. |
||
22 | -moz-user-focus | -moz-user-focus, CSS, CSS:Mozilla Extensions, NeedsContent, Non-standard, Reference |
The -moz-user-focus CSS property is used to indicate whether an element can have the focus. |
||
23 | -moz-user-input | CSS, CSS Property, CSS:Mozilla Extensions, Deprecated, Non-standard, Reference |
In Mozilla applications, -moz-user-input determines if an element will accept user input. |
||
24 | -moz-window-shadow | CSS, CSS Property, NeedsCompatTable, Non-standard, Reference, XUL |
The -moz-window-shadow CSS property specifies whether a window will have a shadow. It only works on Mac OS X. |
||
25 | -ms-accelerator | CSS, CSS Property, Non-standard, Reference |
The -ms-accelerator CSS property is a Microsoft extension that sets or retrieves a string indicating whether the object represents a keyboard shortcut. |
||
26 | -ms-block-progression | CSS, CSS Property, Non-standard, Reference |
The -ms-block-progression CSS property is a Microsoft extension that specifies the block progression and layout orientation. |
||
27 | -ms-content-zoom-chaining | CSS, CSS Property, Non-standard, Reference |
The -ms-content-zoom-chaining CSS property is a Microsoft extension specifying the zoom behavior that occurs when a user hits the zoom limit during page manipulation. |
||
28 | -ms-content-zoom-limit | CSS, CSS Property, Non-standard, Reference |
The -ms-content-zoom-limit CSS shorthand property is a Microsoft extension that specifies values for the -ms-content-zoom-limit-min and -ms-content-zoom-limit-max properties. |
||
29 | -ms-content-zoom-limit-max | CSS, CSS Property, Non-standard, Reference |
The -ms-content-zoom-limit-max CSS property is a Microsoft extension that specifies the selected elements' maximum zoom factor. |
||
30 | -ms-content-zoom-limit-min | CSS, CSS Property, Non-standard, Reference |
The -ms-content-zoom-limit-min CSS property is a Microsoft extension that specifies the minimum zoom factor. |
||
31 | -ms-content-zoom-snap | CSS, CSS Property, Non-standard, Reference |
The -ms-content-zoom-snap CSS shorthand property is a Microsoft extension that specifies values for the -ms-content-zoom-snap-type and -ms-content-zoom-snap-points properties. |
||
32 | -ms-content-zoom-snap-points | CSS, CSS Property, Non-standard, Reference |
The -ms-content-zoom-snap-points CSS property is a Microsoft extension that specifies where zoom snap-points are located. |
||
33 | -ms-content-zoom-snap-type | CSS, CSS Property, Non-standard, Reference |
The -ms-content-zoom-snap-type CSS property is a Microsoft extension that specifies how zooming is affected by defined snap-points. |
||
34 | -ms-content-zooming | CSS, CSS Property, Non-standard, Reference |
The -ms-content-zooming CSS property is a Microsoft extension that specifies whether zooming is enabled. |
||
35 | -ms-filter | CSS, CSS Property, CSS:Microsoft Extensions, Non-standard, Obsolete, Reference |
The -ms-filter CSS property is a Microsoft extension that sets or retrieves the filter or collection of filters applied to an object. |
||
36 | -ms-flow-from | CSS, CSS Property, Non-standard, Reference |
The -ms-flow-from CSS property is a Microsoft extension that gets or sets a value identifying a region container in the document that accepts the content flow from the data source. |
||
37 | -ms-flow-into | CSS, CSS Property, Non-standard, Reference |
The -ms-flow-into CSS property is a Microsoft extension that gets or sets a value identifying an iframe container in the document that serves as the region's data source. |
||
38 | -ms-high-contrast-adjust | CSS, CSS Property, Non-standard, Reference |
The -ms-high-contrast-adjust CSS property is a Microsoft extension that gets or sets a value indicating whether to override any CSS properties that would have been set in high contrast mode. |
||
39 | -ms-hyphenate-limit-chars | CSS, CSS Property, Non-standard, Reference |
The -ms-hyphenate-limit-chars CSS property is a Microsoft extension that specifies one to three values indicating the minimum number of characters in a hyphenated word. If the word does not meet the required minimum number of characters in the word, before the hyphen, or after the hyphen, then the word is not hyphenated. |
||
40 | -ms-hyphenate-limit-lines | CSS, CSS Property, Non-standard, Reference |
The -ms-hyphenate-limit-lines CSS property is a Microsoft extension specifying the maximum number of consecutive lines in an element that may be ended with a hyphenated word. |
||
41 | -ms-hyphenate-limit-zone | CSS, CSS Property, Non-standard, Reference |
The -ms-hyphenate-limit-zone CSS property is a Microsoft extension specifying the width of the hyphenation zone. |
||
42 | -ms-ime-align | CSS, CSS Property, NeedsBrowserCompatibility, Non-standard, Reference |
The -ms-ime-align CSS property is a Microsoft extension aligning the Input Method Editor (IME) candidate window box relative to the element on which the IME composition is active. The extension is implemented in Microsoft Edge and Internet Explorer 11. |
||
43 | -ms-overflow-style | CSS, CSS Property, NeedsBrowserCompatibility, NeedsCompatTable, NeedsExample, NeedsMobileBrowserCompatibility, Non-standard, Reference |
The -ms-overflow-style CSS property is a Microsoft extension controlling the behavior of scrollbars when the content of an element overflows. |
||
44 | -ms-scroll-chaining | CSS, CSS Property, Non-standard, Reference |
The -ms-scroll-chaining CSS property is a Microsoft extension that specifies the scrolling behavior that occurs when a user hits the scroll limit during a manipulation. |
||
45 | -ms-scroll-limit | CSS, CSS Property, Non-standard, Reference |
The -ms-scroll-limit CSS property is a Microsoft extension that specifies values for the -ms-scroll-limit-x-min , -ms-scroll-limit-y-min , -ms-scroll-limit-x-max , and -ms-scroll-limit-y-max properties. |
||
46 | -ms-scroll-limit-x-max | CSS, CSS Property, Non-standard, Reference |
The -ms-scroll-limit-x-max CSS property is a Microsoft extension that specifies the maximum value for the Element.scrollLeft property. |
||
47 | -ms-scroll-limit-x-min | CSS, CSS Property, Non-standard, Reference |
The -ms-scroll-limit-x-min CSS property is a Microsoft extension that specifies the minimum value for the Element.scrollLeft property. |
||
48 | -ms-scroll-limit-y-max | CSS, CSS Property, Non-standard, Reference |
The -ms-scroll-limit-y-max CSS property is a Microsoft extension that specifies the maximum value for the Element.scrollTop property. |
||
49 | -ms-scroll-limit-y-min | CSS, CSS Property, Non-standard, Reference |
The -ms-scroll-limit-y-min CSS property is a Microsoft extension that specifies the minimum value for the Element.scrollTop property. |
||
50 | -ms-scroll-rails | CSS, CSS Property, Non-standard, Reference |
The -ms-scroll-rails CSS property is a Microsoft extension that specifies whether scrolling locks to the primary axis of motion. |
||
51 | -ms-scroll-snap-points-x | CSS, CSS Property, Non-standard, Reference |
The -ms-scroll-snap-points-x CSS property is a Microsoft extension that specifies where snap-points will be located along the x-axis. |
||
52 | -ms-scroll-snap-points-y | CSS, CSS Property, CSS Scroll Snap, CSS:Microsoft Extensions, Non-standard, Reference |
The -ms-scroll-snap-points-y CSS property is a Microsoft extension that specifies where snap-points will be located along the y-axis. |
||
53 | -ms-scroll-snap-x | CSS, CSS Property, CSS Scroll Snap, CSS:Microsoft Extensions, Non-standard, Reference |
The -ms-scroll-snap-x CSS shorthand property is a Microsoft extension that specifies values for the -ms-scroll-snap-type and -ms-scroll-snap-points-x properties. |
||
54 | -ms-scroll-snap-y | CSS, CSS Property, CSS Scroll Snap, CSS:Microsoft Extensions, Non-standard, Reference |
The -ms-scroll-snap-x CSS shorthand property is a Microsoft extension that specifies values for the -ms-scroll-snap-type and -ms-scroll-snap-points-y properties. |
||
55 | -ms-scroll-translation | CSS, CSS Property, CSS Scroll Snap, CSS:Microsoft Extensions, Non-standard, Reference |
The -ms-scroll-translation CSS property is a Microsoft extension that specifies whether vertical-to-horizontal scroll wheel translation occurs on the specified element. |
||
56 | -ms-scrollbar-3dlight-color | CSS, CSS Property, Non-standard, Obsolete, Reference |
The -ms-scrollbar-3dlight-color CSS property is a Microsoft extension specifying the color of the top and left edges of the scroll box and scroll arrows of a scroll bar. |
||
57 | -ms-scrollbar-arrow-color | CSS, CSS Property, Non-standard, Obsolete, Reference |
The -ms-scrollbar-arrow-color CSS property is a Microsoft extension that specifies the color of the arrow elements of a scroll arrow. |
||
58 | -ms-scrollbar-base-color | CSS, CSS Property, Non-standard, Obsolete, Reference |
The -ms-scrollbar-base-color CSS property is a Microsoft extension that specifies the base color of the main elements of a scroll bar. |
||
59 | -ms-scrollbar-darkshadow-color | CSS, CSS Property, Non-standard, Obsolete, Reference |
The -ms-scrollbar-darkshadow-color CSS property is a Microsoft extension that specifies the color of a scroll bar's gutter. |
||
60 | -ms-scrollbar-face-color | CSS, CSS Property, CSS:Microsoft extentions, Non-standard, Obsolete, Reference |
The -ms-scrollbar-face-color CSS property is a Microsoft extension that specifies the color of the scroll box and scroll arrows of a scroll bar. |
||
61 | -ms-scrollbar-highlight-color | CSS, CSS Property, Non-standard, Obsolete, Reference |
The -ms-scrollbar-highlight-color CSS property is a Microsoft extension that specifies the color of the slider tray, the top and left edges of the scroll box, and the scroll arrows of a scroll bar. |
||
62 | -ms-scrollbar-shadow-color | CSS, CSS Property, Non-standard, Obsolete, Reference |
The -ms-scrollbar-shadow-color CSS property is a Microsoft extension that specifies the color of the bottom and right edges of the scroll box and scroll arrows of a scroll bar. |
||
63 | -ms-scrollbar-track-color | CSS, CSS Property, Non-standard, Obsolete, Reference |
The -ms-scrollbar-track-color CSS property is a Microsoft extension that specifies the color of the track element of a scrollbar. |
||
64 | -ms-text-autospace | CSS, CSS Property, CSS:Microsoft Extensions, Non-standard, Reference |
The -ms-text-autospace CSS property is a Microsoft extension that specifies the autospacing and narrow space width adjustment of text. |
||
65 | -ms-touch-select | CSS, CSS Property, CSS:Microsoft Extensions, Non-standard, Reference |
The -ms-touch-select CSS property is a Microsoft extension that toggles the gripper visual elements that enable touch text selection. |
||
66 | -ms-wrap-flow | CSS, CSS Property, CSS:Microsoft Extensions, Non-standard, Reference |
The -ms-wrap-flow CSS property is a Microsoft extension that specifies how exclusions impact inline content within block-level elements. |
||
67 | -ms-wrap-margin | CSS, CSS Property, CSS:Microsoft Extensions, Non-standard, Reference |
The -ms-wrap-margin CSS property is a Microsoft extension that specifies a margin that offsets the inner wrap shape from other shapes. |
||
68 | -ms-wrap-through | CSS, CSS Property, CSS:Microsoft Extensions, Non-standard, Reference |
The -ms-wrap-through CSS property is a Microsoft extension that specifies how content should wrap around an exclusion element. |
||
69 | -webkit-border-before | -webkit-border-before, CSS, CSS Property, CSS:WebKit Extensions, Non-standard, Reference |
The -webkit-border-before CSS property is a shorthand property for setting the individual logical block start border property values in a single place in the style sheet. |
||
70 | -webkit-box-reflect | -webkit-box-reflect, CSS, CSS Property, CSS:WebKit Extensions, Non-standard, Reference |
The -webkit-box-reflect CSS property lets you reflect the content of an element in one specific direction. |
||
71 | -webkit-mask-attachment | CSS, CSS Property, Layout, Non-standard, Reference, Web |
If a -webkit-mask-image is specified, -webkit-mask-attachment determines whether the mask image's position is fixed within the viewport, or scrolls along with its containing block. |
||
72 | -webkit-mask-box-image | CSS, Layout, Non-standard, Reference, Web |
-webkit-mask-box-image sets the mask image for an element's border box. |
||
73 | -webkit-mask-composite | -webkit-mask-composite, CSS, CSS Masking, CSS Property, CSS:WebKit Extensions, Non-standard, Reference, mask-composite |
The -webkit-mask-composite property specifies the manner in which multiple mask images applied to the same element are composited with one another. |
||
74 | -webkit-mask-position-x | CSS, CSS Masking, CSS Property, Non-standard, Reference |
The -webkit-mask-position-x CSS property sets the initial horizontal position of a mask image. |
||
75 | -webkit-mask-position-y | CSS, CSS Masking, CSS Property, Non-standard, Reference |
The -webkit-mask-position-y CSS property sets the initial vertical position of a mask image. |
||
76 | -webkit-mask-repeat-x | CSS, CSS Masking, CSS Property, Non-standard, Reference |
The -webkit-mask-repeat-x property specifies whether and how a mask image is repeated (tiled) horizontally. |
||
77 | -webkit-mask-repeat-y | CSS, CSS Masking, CSS Property, Non-standard, Reference |
The -webkit-mask-repeat-y property sets whether and how a mask image is repeated (tiled) vertically. |
||
78 | -webkit-overflow-scrolling | CSS, CSS Property, Non-standard, Reference |
The -webkit-overflow-scrolling CSS property controls whether or not touch devices use momentum-based scrolling for a given element. |
||
79 | -webkit-print-color-adjust | CSS, CSS Property, Layout, Non-standard, Web |
The -webkit-print-color-adjust property is a non-standard CSS extension that can be used to force printing of background colors and images in browsers based on the WebKit engine. |
||
80 | -webkit-tap-highlight-color | CSS, CSS Property, NeedsCompatTable, NeedsExample, NeedsMobileBrowserCompatibility, Non-standard, Reference |
-webkit-tap-highlight-color is a non-standard CSS property that sets the color of the highlight that appears over a link while it's being tapped. The highlighting indicates to the user that their tap is being successfully recognized, and indicates which element they're tapping on. |
||
81 | -webkit-text-fill-color | CSS, CSS Property, Non-standard, Reference |
The -webkit-text-fill-color CSS property specifies the fill color of characters of text. If this property is not set, the value of the color property is used. |
||
82 | -webkit-text-security | CSS, CSS Property, NeedsCompatTable, Non-standard, Reference |
-webkit-text-security is a non-standard CSS property that obfuscates characters in a <form> field (such as <input> or <textarea> ) by replacing them with a shape. It only affects fields that are not of type=password . |
||
83 | -webkit-text-stroke | CSS, CSS Property, Non-standard, Reference, WebKit |
The -webkit-text-stroke CSS property specifies the width and color of strokes for text characters. This is a shorthand property for the longhand properties -webkit-text-stroke-width and -webkit-text-stroke-color . |
||
84 | -webkit-text-stroke-color | CSS, CSS Property, Non-standard, Reference, WebKit |
The -webkit-text-stroke-color CSS property specifies the stroke color of characters of text. If this property is not set, the value of the color property is used. |
||
85 | -webkit-text-stroke-width | CSS, CSS Property, Non-standard, Reference, WebKit |
The -webkit-text-stroke-width CSS property specifies the width of the stroke for text. |
||
86 | -webkit-touch-callout | CSS, CSS Property, Layout, NeedsLiveSample, Non-standard, Reference, WebKit |
The -webkit-touch-callout CSS property controls the display of the default callout shown when you touch and hold a touch target. |
||
87 | :-moz-broken | CSS, CSS:Mozilla Extensions, NeedsCompatTable, Non-standard, Pseudo-class, Reference |
The :-moz-broken CSS pseudo-class is a Mozilla extension that matches elements representing broken image links. |
||
88 | :-moz-drag-over | CSS, CSS:Mozilla Extensions, NeedsCompatTable, Non-standard, Pseudo-class, Reference |
The :-moz-drag-over CSS pseudo-class is a Mozilla extension that matches an element when a dragover event is called on it. |
||
89 | :-moz-first-node | CSS, CSS:Mozilla Extensions, NeedsCompatTable, Non-standard, Pseudo-class, Reference |
The :-moz-first-node CSS pseudo-class is a Mozilla extension that represents any element that is the first child node of some other element. It differs from :first-child because it does not match a first-child element with (non-whitespace) text before it. |
||
90 | :-moz-focusring | CSS, CSS:Mozilla Extensions, Non-standard, Pseudo-class, Reference |
The :-moz-focusring CSS pseudo-class is a Mozilla extension that is similar to the :focus pseudo-class, but it only matches an element if it's currently focused and a focus ring or other indicator should be drawn around it. |
||
91 | :-moz-full-screen-ancestor | CSS, CSS:Mozilla Extensions, Deprecated, Non-standard, Pseudo-class, Reference |
The :-moz-full-screen-ancestor CSS pseudo-class is a Mozilla extension that represents all ancestors of the full-screen element, except containing frames in parent documents, which are the full-screen element in their own documents. However, those elements' ancestors have this pseudo-class applied to them. |
||
92 | :-moz-handler-blocked | CSS, CSS:Mozilla Extensions, Non-standard, Pseudo-class, Reference |
The :-moz-handler-blocked CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because their handlers have been blocked. |
||
93 | :-moz-handler-crashed | CSS, CSS:Mozilla Extensions, Non-standard, Pseudo-class, Reference |
The :-moz-handler-crashed CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because the plugin responsible for drawing them has crashed. |
||
94 | :-moz-handler-disabled | CSS, CSS:Mozilla Extensions, Non-standard, Pseudo-class, Reference |
The :-moz-handler-disabled CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because their handlers have been disabled by the user. |
||
95 | :-moz-last-node | CSS, CSS:Mozilla Extensions, NeedsCompatTable, Non-standard, Pseudo-class |
The :-moz-last-node CSS pseudo-class is a Mozilla extension that represents any element that is the last child node of some other element. It differs from :last-child because it does not match a last-child element with (non-whitespace) text after it. |
||
96 | :-moz-loading | CSS, CSS:Mozilla Extensions, NeedsCompatTable, Non-standard, Pseudo-class, Reference |
The :-moz-loading CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because they have not started loading, such as images that haven't started to arrive yet. Note that images that are in the process of loading are not matched by this pseudo-class. |
||
97 | :-moz-locale-dir(ltr) | CSS, CSS:Mozilla Extensions, Localization, NeedsCompatTable, Non-standard, Pseudo-class, Reference |
The :-moz-locale-dir(ltr) CSS pseudo-class is a Mozilla extension that matches an element if the user interface is being displayed left-to-right. This is determined by the preference intl.uidirection.locale (where locale is the current locale) being set to "ltr". |
||
98 | :-moz-locale-dir(rtl) | :-moz-locale-dir, CSS, CSS:Mozilla Extensions, Localization, NeedsCompatTable, NeedsExample, Non-standard, Pseudo-class, Reference, Right-to-left |
The :-moz-locale-dir(rtl) CSS pseudo-class is a Mozilla extension that matches an element if the user interface is being displayed right-to-left. This is determined by the preference intl.uidirection.locale (where locale is the current locale) being set to "rtl". |
||
99 | :-moz-lwtheme | CSS, Lightweight themes, NeedsCompatTable, NeedsExample, Non-standard, Pseudo-class, Reference, Themes |
The :-moz-lwtheme pseudo-class matches in chrome documents when the root element's lightweightthemes attribute is true and a theme is selected. |
||
100 | :-moz-lwtheme-brighttext | CSS, Non-standard, Pseudo-class, Reference, Themes |
The :-moz-lwtheme-brighttext pseudo-class matches in chrome documents when :-moz-lwtheme is true and a lightweight theme with a bright text color is selected. |
||
101 | :-moz-lwtheme-darktext | CSS, Non-standard, Pseudo-class, Reference, Themes |
The :-moz-lwtheme-darktext pseudo-class matches in chrome documents when :-moz-lwtheme is true and a lightweight theme with a dark text color is selected. |
||
102 | :-moz-only-whitespace | :-moz-only-whitespace, CSS, Non-standard, Pseudo-class, Reference, Selectors |
The :-moz-only-whitespace CSS pseudo-class matches elements that have no child nodes at all, or only have empty text nodes or text nodes that have only whitespace in them. |
||
103 | :-moz-submit-invalid | :-moz-submit-invalid, CSS, CSS:Mozilla Extensions, Non-standard, Pseudo-class, Reference |
The :-moz-submit-invalid CSS pseudo-class is a Mozilla extension that represents any submit <button> on forms whose contents aren't valid based on their validation constraints. |
||
104 | :-moz-suppressed | CSS, CSS:Mozilla Extensions, NeedsCompatTable, Non-standard, Pseudo-class, Reference |
The :-moz-suppressed CSS pseudo-class is a Mozilla extension that matches elements representing images that were suppressed because loading images from the specified site has been blocked. |
||
105 | :-moz-system-metric() | :-moz-system-metric, CSS, CSS:Mozilla Extensions, Non-standard, Obsolete, Pseudo-class |
This page was auto-generated because a user created a sub-page to this page. | ||
106 | :-moz-system-metric(images-in-menus) | CSS, NeedsContent, NeedsExample, Non-standard, Reference |
The :-moz-system-metric(images-in-menus) CSS pseudo-class matches an element if the computer's user interface supports images in menus. |
||
107 | :-moz-system-metric(mac-graphite-theme) | :-moz-system-metric, CSS, CSS:Mozilla Extensions, Non-standard, Reference |
:-moz-system-metric(mac-graphite-theme) will match an element if the user has chosen the "Graphite" appearance in the "Appearance" prefpane of the Mac OS X System Preferences. |
||
108 | :-moz-system-metric(scrollbar-end-backward) | CSS, NeedsContent, NeedsExample, Non-standard, Pseudo-class, Reference |
The :-moz-system-metric(scrollbar-end-backward) CSS pseudo-class will match an element if the computer's user interface includes a backward arrow button at the end of scrollbars. |
||
109 | :-moz-system-metric(scrollbar-end-forward) | CSS, NeedsContent, NeedsExample, Non-standard, Pseudo-class, Reference |
The :-moz-system-metric(scrollbar-end-forward) CSS pseudo-class will match an element if the computer's user interface includes a forward arrow button at the end of scrollbars. |
||
110 | :-moz-system-metric(scrollbar-start-backward) | CSS, NeedsContent, NeedsExample, Non-standard, Pseudo-class, Reference |
The :-moz-system-metric(scrollbar-start-backward) CSS pseudo-class will match an element if the computer's user interface includes a backward arrow button at the start of scrollbars. |
||
111 | :-moz-system-metric(scrollbar-start-forward) | CSS, NeedsContent, NeedsExample, Non-standard, Pseudo-class, Reference |
The :-moz-system-metric(scrollbar-start-forward) CSS pseudo-class will match an element if the computer's user interface includes a forward arrow button at the start of scrollbars. |
||
112 | :-moz-system-metric(scrollbar-thumb-proportional) | CSS, NeedsContent, NeedsExample, Non-standard, Pseudo-class, Reference |
The :-moz-system-metric(scrollbar-thumb-proportional) CSS pseudo-class will match an element if the computer's user interface uses proportional scrollbar thumbs; that is, the draggable thumb on the scrollbar resizes to indicate the relative size of the visible area of the document. |
||
113 | :-moz-system-metric(touch-enabled) | CSS, NeedsContent, NeedsExample, Non-standard, Pseudo-class, Reference |
The :-moz-system-metric(touch-enabled) CSS pseudo-class will match an element if the device on which the content is being rendered offers a supported touch-screen interface. |
||
114 | :-moz-system-metric(windows-default-theme) | CSS, Mozilla, Non-standard, Pseudo-class, Reference |
The :-moz-system-metric(windows-default-theme) CSS pseudo-class matches an element if the user is currently using one of the following themes in Windows: Luna, Royale, Zune, or Aero (i.e., Vista Basic, Vista Standard, or Aero Glass). This will exclude Windows Classic themes as well as third-party themes. |
||
115 | :-moz-tree-cell | CSS, NeedsCompatTable, NeedsContent, NeedsExample, Non-standard, Reference, XUL |
Activated by the properties attribute. |
||
116 | :-moz-tree-cell-text | CSS, NeedsCompatTable, NeedsContent, NeedsExample, Non-standard, Reference, XUL |
Activated by the properties attribute. |
||
117 | :-moz-tree-cell-text(hover) | CSS, NeedsCompatTable, NeedsContent, NeedsExample, Non-standard, Pseudo-class, Reference, XUL |
The :-moz-tree-cell-text(hover) CSS pseudo-class will match an element if the mouse cursor is presently hovering over text in a tree cell. |
||
118 | :-moz-tree-column | CSS, NeedsCompatTable, NeedsContent, NeedsExample, Non-standard, Reference, XUL |
Activated by the properties attribute. |
||
119 | :-moz-tree-drop-feedback | CSS, NeedsCompatTable, NeedsContent, NeedsExample, Non-standard, Pseudo-class, Reference, XUL |
Activated by the properties attribute. |
||
120 | :-moz-tree-image | CSS, NeedsCompatTable, NeedsContent, NeedsLiveSample, Non-standard, Reference, XUL |
Activated by the properties attribute. |
||
121 | :-moz-tree-indentation | CSS, NeedsCompatTable, NeedsContent, NeedsExample, Non-standard, Reference, XUL |
Activated by the properties attribute. |
||
122 | :-moz-tree-line | CSS, Non-standard, Reference, XUL |
Activated by the properties attribute. |
||
123 | :-moz-tree-progressmeter | CSS, NeedsCompatTable, NeedsContent, NeedsExample, Non-standard, Reference, XUL |
Activated when the type attribute is set to progressmeter . |
||
124 | :-moz-tree-row(hover) | CSS, NeedsCompatTable, NeedsContent, NeedsExample, Non-standard, Pseudo-class, Reference |
The :-moz-tree-row(hover) CSS pseudo-class will match an element if the mouse cursor is presently hovering over a tree row. |
||
125 | :-moz-tree-separator | CSS, NeedsCompatTable, NeedsContent, NeedsExample, Non-standard, Reference, XUL |
Activated by the properties attribute. |
||
126 | :-moz-tree-twisty | CSS, Non-standard, Reference, XUL |
Activated by the properties attribute. |
||
127 | :-moz-ui-invalid | CSS, CSS Selectors, CSS:Mozilla Extensions, NeedsExample, NeedsMobileBrowserCompatibility, Non-standard, Pseudo-class, Reference |
The :-moz-ui-invalid CSS pseudo-class represents any validated form element whose value isn't valid based on their validation constraints, in certain circumstances. This pseudo-class is applied according to the following rules: |
||
128 | :-moz-ui-valid | CSS, CSS Selectors, CSS:Mozilla Extensions, NeedsExample, NeedsMobileBrowserCompatibility, Non-standard, Pseudo-class, Reference |
The :-moz-ui-valid CSS pseudo-class represents any validated form element whose value validates correctly based on its validation constraints. |
||
129 | :-moz-user-disabled | CSS, CSS:Mozilla Extensions, NeedsCompatTable, Non-standard, Pseudo-class, Reference |
The :-moz-user-disabled CSS pseudo-class is a Mozilla extension that matches elements representing images that were not loaded because images have been entirely disabled by the user's preferences. |
||
130 | :-moz-window-inactive | CSS, CSS:Mozilla Extensions, Non-standard, Pseudo-class, Reference |
The :-moz-window-inactive CSS pseudo-class is a Mozilla extension that matches any element while it's in an inactive window. |
||
131 | :-webkit-autofill | CSS, NeedsExample, Non-standard, Pseudo-class, Reference |
The :-webkit-autofill CSS pseudo-class matches when an <input> element has its value autofilled by the browser. |
||
132 | ::-moz-color-swatch | CSS, CSS:Mozilla Extensions, Non-standard, Pseudo-element, Reference |
The ::-moz-color-swatch CSS pseudo-element is a Mozilla extension that represents the color selected in an <input> of type="color" . |
||
133 | ::-moz-list-bullet | CSS, CSS:Mozilla Extensions, NeedsCompatTable, Non-standard, Pseudo-element, Reference |
The ::-moz-list-bullet CSS pseudo-element is a Mozilla extension that represents the marker (typically a bullet) of a list item (<li> ) in an unordered list (<ul> ). |
||
134 | ::-moz-list-number | CSS, CSS:Mozilla Extensions, NeedsCompatTable, Non-standard, Pseudo-element, Reference |
The ::-moz-list-number CSS pseudo-element is a Mozilla extension that represents the marker (typically a number) of a list item (<li> ) in an ordered list (<ol> ). |
||
135 | ::-moz-page | CSS, CSS:Mozilla Extensions, NeedsContent, NeedsExample, Non-standard, Pseudo-element, Reference |
The ::-moz-page CSS pseudo-element is a Mozilla extension that represents an individual page when printed or in a print preview. |
||
136 | ::-moz-page-sequence | CSS, CSS:Mozilla Extensions, NeedsExample, Non-standard, Pseudo-element, Reference |
The ::-moz-page-sequence CSS pseudo-element is a Mozilla extension that represents the background of a print preview. |
||
137 | ::-moz-progress-bar | CSS, CSS:Mozilla Extensions, NeedsCompatTable, Non-standard, Pseudo-element, Reference |
The ::-moz-progress-bar CSS pseudo-element is a Mozilla extension that represents the progress bar inside a <progress> element. (The bar represents the amount of progress that has been made.) |
||
138 | ::-moz-range-progress | CSS, CSS:Mozilla Extensions, Non-standard, Pseudo-element, Reference |
The ::-moz-range-progress CSS pseudo-element is a Mozilla extension that represents the lower portion of the track (i.e., groove) in which the indicator slides in an <input> of type="range" . This portion corresponds to values lower than the value currently selected by the thumb (i.e., virtual knob). |
||
139 | ::-moz-range-thumb | CSS, CSS:Mozilla Extensions, Non-standard, Pseudo-element, Reference |
The ::-moz-range-thumb CSS pseudo-element is a Mozilla extension that represents the thumb (i.e., virtual knob) of an <input> of type="range" . The user can move the thumb along the input's track to alter its numerical value. |
||
140 | ::-moz-range-track | CSS, CSS:Mozilla Extensions, Non-standard, Pseudo-element, Reference |
The ::-moz-range-track CSS pseudo-element is a Mozilla extension that represents the track (i.e., groove) in which the indicator slides in an <input> of type="range" . |
||
141 | ::-moz-scrolled-page-sequence | CSS, CSS:Mozilla Extensions, NeedsContent, NeedsExample, Non-standard, Pseudo-element, Reference |
The ::-moz-scrolled-page-sequence CSS pseudo-element is a Mozilla extension that represents the background of a print preview. |
||
142 | ::-moz-tree-row | CSS, Non-standard, Pseudo-element, Reference, XUL |
The ::-moz-tree-row CSS pseudo-element is used to select rows and apply styles to tree rows. |
||
143 | ::-ms-browse | CSS, Non-standard, Pseudo-element, Reference |
The ::-ms-browse CSS pseudo-element is a Microsoft extension that represents the button that opens the file picker of <input type="file">. |
||
144 | ::-ms-check | CSS, Non-standard, Pseudo-element, Reference |
The ::-ms-check CSS pseudo-element is a Microsoft extension that represents checkboxes and radio button groups created by <input type="checkbox"> and <input type="radio">. |
||
145 | ::-ms-clear | CSS, Non-standard, Pseudo-element, Reference |
The ::-ms-clear CSS pseudo-element creates a clear button at the edge of an <input type="text"> text control that clears the current value. This pseudo-element is non-standard, supported only in Internet Explorer 10, Internet Explorer 11, and Microsoft Edge. The clear button is only shown on focused, non-empty text controls. |
||
146 | ::-ms-expand | CSS, Non-standard, Pseudo-element, Reference |
The ::-ms-expand CSS pseudo-element is a Microsoft extension that represents the button of a <select> menu control that opens or closes the drop-down menu. Typically it is a triangle that points downward. |
||
147 | ::-ms-fill | CSS, Non-standard, Pseudo-element, Reference |
The ::-ms-fill CSS pseudo-element is a Microsoft extension that represents a progress bar displayed by <progress> . |
||
148 | ::-ms-fill-lower | CSS, NeedsBrowserCompatibility, NeedsExample, NeedsMobileBrowserCompatibility, Non-standard, Pseudo-element, Reference |
The ::-ms-fill-lower CSS pseudo-element represents the lower portion of the track of a slider control; that is, the portion corresponding to values less than the value currently selected by the thumb. A slider control is one possible representation of <input type="range">. |
||
149 | ::-ms-fill-upper | CSS, NeedsBrowserCompatibility, NeedsExample, NeedsMobileBrowserCompatibility, Non-standard, Pseudo-element, Reference |
The ::-ms-fill-upper CSS pseudo-element is a Microsoft extension that represents the upper portion of the track of a slider control; that is, the portion corresponding to values greater than the value currently selected by the thumb. A slider control is one possible representation of <input type="range">. |
||
150 | ::-ms-reveal | CSS, NeedsContent, NeedsExample, Non-standard, Pseudo-element, Reference |
The ::-ms-reveal CSS pseudo-element is a Microsoft extension that is used to display a password reveal button for use with a password field created by <input type="password"> . The user presses the button to reveal the actual field value rather than asterisks. |
||
151 | ::-ms-thumb | CSS, NeedsBrowserCompatibility, NeedsCompatTable, NeedsExample, NeedsMobileBrowserCompatibility, Non-standard, Pseudo-element, Reference |
The ::-ms-thumb CSS pseudo-element is a Microsoft extension that represents the thumb that the user moves within the track of a slider control to alter its numerical value. A slider control is one possible representation of <input type="range">. |
||
152 | ::-ms-ticks-after | CSS, Non-standard, Pseudo-element, Reference |
The ::-ms-ticks-after CSS pseudo-element is a Microsoft extension that applies one or more styles to the tick marks that appear after the track of a slider control. A slider control is one possible representation of <input type="range">. |
||
153 | ::-ms-ticks-before | CSS, Non-standard, Pseudo-element, Reference |
The ::-ms-ticks-before CSS pseudo-element is a Microsoft extension that applies one or more styles to the tick marks that appear before the track of a slider control. A slider control is one possible representation of <input type="range">. |
||
154 | ::-ms-tooltip | CSS, Non-standard, Pseudo-element, Reference |
The ::-ms-tooltip CSS pseudo-element is a Microsoft extension that represents the tooltip of a slider control. A slider control is one possible representation of <input type="range">. |
||
155 | ::-ms-track | CSS, NeedsBrowserCompatibility, NeedsCompatTable, NeedsExample, NeedsMobileBrowserCompatibility, Non-standard, Pseudo-element, Reference |
The ::-ms-track CSS pseudo-element is a Microsoft extension that represents the track of a slider control. A slider control is one possible representation of <input type="range">. |
||
156 | ::-ms-value | CSS, Non-standard, Pseudo-element, Reference |
The ::-ms-value CSS pseudo-element is a Microsoft extension that applies rules to the value of a text or password <input> control or the content of a <select> control. |
||
157 | ::-webkit-file-upload-button | CSS, Non-standard, Pseudo-element, Reference |
The ::-webkit-file-upload-button CSS pseudo-element represents the button of an <input> of type="file" . |
||
158 | ::-webkit-inner-spin-button | CSS, NeedsBrowserCompatibility, NeedsMobileBrowserCompatibility, Non-standard, Pseudo-element, Reference |
The ::-webkit-inner-spin-button CSS pseudo-element is used to style the inner part of the spinner button of number picker input elements. |
||
159 | ::-webkit-meter-bar | -webkit-meter-bar, CSS, Non-standard, Pseudo-element, Reference, WebKit |
The ::-webkit-meter-bar CSS pseudo-class is a WebKit extension that represents the meter bar in a <meter> element. |
||
160 | ::-webkit-meter-even-less-good-value | -webkit-meter-even-less-good-value, CSS, Non-standard, Pseudo-element, Reference |
The ::-webkit-meter-even-less-good-value gives a red color to a <meter> element when the value and the optimum attributes fall outside the low-high range, but in opposite zones. To illustrate, it applies when value < low < high < optimum or value > high > low > optimum. |
||
161 | ::-webkit-meter-inner-element | -webkit-meter-inner-element, CSS, Non-standard, Pseudo-element, Reference |
::-webkit-meter-inner-element is a proprietary WebKit CSS pseudo-element for selecting and applying styles to to the outer containing element of a <meter> element. Additional markup to render the meter element as read-only. |
||
162 | ::-webkit-meter-optimum-value | ::-webkit-meter-optimum-value, CSS, Non-standard, Pseudo-element, Reference |
The ::-webkit-meter-optimum-value CSS pseudo-element styles the <meter> element when its value is inside the low-high range. |
||
163 | ::-webkit-meter-suboptimum-value | -webkit-meter-suboptimum-value, CSS, Non-standard, Pseudo-element, Reference |
The ::-webkit-meter-suboptimum-value pseudo-element gives a yellow color to the <meter> element when the value attribute falls outside of the low-high range. |
||
164 | ::-webkit-outer-spin-button | CSS, Non-standard, Pseudo-element, Reference |
The ::-webkit-outer-spin-button CSS pseudo-element is used to style the outer part of the spinner button of number picker <input> elements. |
||
165 | ::-webkit-progress-bar | CSS, Non-standard, Pseudo-element, Reference |
The ::-webkit-progress-bar CSS pseudo-element represents the entire bar of a <progress> element. Normally it's only visible as the unfilled portion of the bar, since by default it's rendered below the ::-webkit-progress-value pseudo-element. It is a child of the ::-webkit-progress-inner-element pseudo-element and the parent of the ::-webkit-progress-value pseudo-element. |
||
166 | ::-webkit-progress-inner-element | CSS, Non-standard, Pseudo-element, Reference |
The ::-webkit-progress-inner-element CSS pseudo-element represents the outermost container of the <progress> element. It is the parent of the ::-webkit-progress-bar pseudo-element. |
||
167 | ::-webkit-progress-value | CSS, Non-standard, Pseudo-element, Reference |
The ::-webkit-progress-value CSS pseudo-element represents the filled-in portion of the bar of a <progress> element. It is a child of the ::-webkit-progress-bar pseudo-element. |
||
168 | ::-webkit-scrollbar | ::-webkit-scrollbar, CSS, CSS Selectors, CSS:WebKit Extensions, NeedsCompatTable, Non-standard, Pseudo-element, Reference |
The ::-webkit-scrollbar CSS pseudo-element affects the style of the scrollbar of an element. |
||
169 | ::-webkit-search-cancel-button | CSS, NeedsExample, Non-standard, Pseudo-element, Reference |
The ::-webkit-search-cancel-button CSS pseudo-element represents a button (the "cancel button") at the edge of an <input> of type="search" which clears away the current value of the <input> element. This button and pseudo-element are non-standard, supported only in WebKit and Blink, hence the vendor prefix. The clear button is only shown on non-empty search <input> elements. |
||
170 | ::-webkit-search-results-button | CSS, NeedsExample, Non-standard, Pseudo-element, Reference |
The ::-webkit-search-results-button CSS pseudo-element represents a button (the "search results button") at the left edge of an <input> of type="search" which when clicked displays a menu which allows the user to choose from previous recent search queries. This button and pseudo-element are non-standard, supported only in WebKit and Blink, hence the vendor prefix. The search results button is only shown on search <input> elements that have a results attribute. |
||
171 | ::-webkit-slider-runnable-track | CSS, CSS:WebKit Extensions, NeedsBrowserCompatibility, NeedsCompatTable, NeedsExample, NeedsMobileBrowserCompatibility, Non-standard, Pseudo-element, Reference |
The ::-webkit-slider-runnable-track CSS pseudo-element represents the "track" (the groove in which the indicator slides) of an <input type="range"> . |
||
172 | ::-webkit-slider-thumb | CSS, NeedsBrowserCompatibility, NeedsCompatTable, NeedsExample, NeedsMobileBrowserCompatibility, Non-standard, Pseudo-element, Reference |
The ::-webkit-slider-thumb CSS pseudo-element represents the "thumb" that the user can move within the "groove" of an <input> of type="range" to alter its numerical value. |
||
173 | ::after (:after) | CSS, Layout, Pseudo-element, Reference, Web |
In CSS, ::after creates a pseudo-element that is the last child of the selected element. It is often used to add cosmetic content to an element with the content property. |
||
174 | ::backdrop | API, CSS, Dialog, Full-screen, Fullscreen API, HTML DOM, Layout, Pseudo-element, Reference, fullscreen |
The ::backdrop CSS pseudo-element is a box the size of the viewport which is rendered immediately beneath any element being presented in full-screen mode. |
||
175 | ::before (:before) | CSS, Layout, Pseudo-element, Reference, Web |
In CSS, ::before creates a pseudo-element that is the first child of the selected element. It is often used to add cosmetic content to an element with the content property. |
||
176 | ::cue | ::cue, CSS, Media, Pseudo-element, Reference, Web Video Text Tracks, WebVTT, cue |
The ::cue CSS pseudo-element matches WebVTT cues within a selected element. This can be used to style captions and other cues in media with VTT tracks. |
||
177 | ::first-letter (:first-letter) | CSS, Layout, Pseudo-element, Reference |
The ::first-letter CSS pseudo-element applies styles to the first letter of the first line of a block-level element, but only when not preceded by other content (such as images or inline tables). |
||
178 | ::first-line (:first-line) | CSS, Layout, Pseudo-element, Reference |
The ::first-line CSS pseudo-element applies styles to the first line of a block-level element. |
||
179 | ::grammar-error | CSS, Experimental, NeedsExample, Pseudo-element, Reference |
The ::grammar-error CSS pseudo-element represents a text segment which the user agent has flagged as grammatically incorrect. |
||
180 | ::marker | CSS, CSS Lists, Experimental, Layout, Pseudo-element, Reference |
The ::marker CSS pseudo-element selects the marker box of a list item, which typically contains a bullet or number. |
||
181 | ::placeholder | CSS, Experimental, Pseudo-element, Reference |
The ::placeholder CSS pseudo-element represents the placeholder text of a form element. |
||
182 | ::selection | CSS, Layout, Pseudo-element, Reference |
The ::selection CSS pseudo-element applies styles to the part of a document that has been highlighted by the user (such as clicking and dragging the mouse across text). |
||
183 | ::slotted() | ::slotted, CSS, Layout, Pseudo-element, Reference, Web |
The ::slotted() CSS pseudo-element represents any element that has been placed into a slot inside an HTML template (see Using templates and slots for more information). |
||
184 | ::spelling-error | CSS, Experimental, NeedsExample, Pseudo-element, Reference, Web |
The ::spelling-error CSS pseudo-element represents a text segment which the user agent has flagged as incorrectly spelled. |
||
185 | :active | CSS, Layout, Pseudo-class, Reference, Web |
The :active CSS pseudo-class represents an element (such as a button) that is being activated by the user. |
||
186 | :any-link | CSS, Experimental, Layout, Pseudo-class, Reference, Web |
The :any-link CSS pseudo-class selector represents an element that acts as the source anchor of a hyperlink, independent of whether it has been visited. In other words, it matches every <a> , <area> , or <link> element that has an href attribute. Thus, it matches all elements that match :link or :visited . |
||
187 | :blank | :blank, CSS, CSS Selectors, Draft, Experimental, NeedsContent, NeedsExample, Pseudo-class |
The :blank CSS pseudo-class selects empty user input elements (eg. <input> or <textarea> ). |
||
188 | :checked | CSS, Layout, Pseudo-class, Reference, Web |
The :checked CSS pseudo-class selector represents any radio (<input type="radio"> ), checkbox (<input type="checkbox"> ), or option (<option> in a <select> ) element that is checked or toggled to an on state. |
||
189 | :default | CSS, Layout, Pseudo-class, Reference, Web |
The :default CSS pseudo-class selects form elements that are the default in a group of related elements. |
||
190 | :defined | CSS, Layout, Pseudo-class, Reference, Web |
The :defined CSS pseudo-class represents any element that has been defined. This includes any standard element built in to the browser, and custom elements that have been successfully defined (i.e. with the CustomElementRegistry.define() method). |
||
191 | :dir() | BiDi, CSS, Experimental, Pseudo-class, Reference |
The :dir() CSS pseudo-class matches elements based on the directionality of the text contained in them. |
||
192 | :disabled | CSS, Layout, Pseudo-class, Reference, Web |
The :disabled CSS pseudo-class represents any disabled element. An element is disabled if it can't be activated (selected, clicked on, typed into, etc.) or accept focus. The element also has an enabled state, in which it can be activated or accept focus. |
||
193 | :empty | CSS, Layout, NeedsUpdate, Pseudo-class, Reference, Web |
The :empty CSS pseudo-class represents any element that has no children. Children can be either element nodes or text (including whitespace). Comments, processing instructions, and CSS content do not affect whether an element is considered empty. |
||
194 | :enabled | CSS, Layout, Pseudo-class, Reference, Web |
The :enabled CSS pseudo-class represents any enabled element. An element is enabled if it can be activated (selected, clicked on, typed into, etc.) or accept focus. The element also has a disabled state, in which it can't be activated or accept focus. |
||
195 | :first | @page, CSS, Layout, Pseudo-class, Reference, Web |
The :first CSS pseudo-class, used with the @page at-rule, represents the first page of a printed document. |
||
196 | :first-child | CSS, Layout, Pseudo-class, Reference, Web |
The :first-child CSS pseudo-class represents the first element among a group of sibling elements. |
||
197 | :first-of-type | CSS, Layout, Pseudo-class, Reference, Web |
The :first-of-type CSS pseudo-class represents the first element of its type among a group of sibling elements. |
||
198 | :focus | :focus, CSS, Layout, Pseudo-class, Reference, Web |
The :focus CSS pseudo-class represents an element (such as a form input) that has received focus. It is generally triggered when the user clicks or taps on an element or selects it with the keyboard's "tab" key. |
||
199 | :focus-visible | :focus, :focus-visible, CSS, Experimental, Layout, Pseudo-class, Reference, Web |
The :focus-visible pseudo-class applies while an element matches the :focus pseudo-class and the UA determines via heuristics that the focus should be made evident on the element. (Many browsers show a “focus ring” by default in this case.) |
||
200 | :focus-within | :focus, :focus-within, CSS, Layout, Pseudo-class, Reference, Web |
The :focus-within CSS pseudo-class represents an element that has received focus or contains an element that has received focus. In other words, it represents an element that is itself matched by the :focus pseudo-class or has a descendant that is matched by :focus . (This includes descendants in shadow trees.) |
||
201 | :fullscreen | CSS, Full, Full-screen, Full-screen API, Fullscreen API, Pseudo-class, Reference, fullscreen, screen |
The :fullscreen CSS pseudo-class matches every element which is currently in full-screen mode. If multiple elements have been put into full-screen mode, this selects them all. |
||
202 | :has() | CSS, Experimental, Pseudo-class, Reference, Selectors |
The :has() CSS pseudo-class represents an element if any of the selectors passed as parameters (relative to the :scope of the given element), match at least one element. |
||
203 | :host | :host, CSS, DOM, Layout, Pseudo-class, Reference, Web, Web Components, shadow, shadow dom |
The :host CSS pseudo-class selects the shadow host of the shadow DOM containing the CSS it is used inside — in other words, this allows you select a custom element from inside its shadow DOM. |
||
204 | :host() | :host(), CSS, Layout, Pseudo-class, Reference, Web |
The :host() CSS pseudo-class function selects the shadow host of the shadow DOM containing the CSS it is used inside (so you can select a custom element from inside its shadow DOM) — but only if the selector given as the function's parameter matches the shadow host. |
||
205 | :host-context() | :host-context(), CSS, Experimental, Layout, Pseudo-class, Reference, Web |
The :host-context() CSS pseudo-class function selects the shadow host of the shadow DOM containing the CSS it is used inside (so you can select a custom element from inside its shadow DOM) — but only if the selector given as the function's parameter matches the shadow host's ancestor(s) in the place it sits inside the DOM hierarchy. |
||
206 | :hover | CSS, Layout, Pseudo-class, Reference, Web |
The :hover CSS pseudo-class matches when the user interacts with an element with a pointing device, but does not necessarily activate it. It is generally triggered when the user hovers over an element with the cursor (mouse pointer). |
||
207 | :in-range | CSS, Pseudo-class, Reference, Web |
The :in-range CSS pseudo-class represents an <input> element whose current value is within the range limits specified by the min and max attributes. |
||
208 | :indeterminate | CSS, Layout, Pseudo-class, Reference, Web |
The :indeterminate CSS pseudo-class represents any form element whose state is indeterminate. |
||
209 | :invalid | CSS, Layout, Pseudo-class, Reference, Web |
The :invalid CSS pseudo-class represents any <input> or other <form> element whose contents fail to validate. |
||
210 | :is() (:matches(), :any()) | :is, CSS, Experimental, Pseudo-class, Reference, Selectors, Web |
The :is() CSS pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list. This is useful for writing large selectors in a more compact form. |
||
211 | :lang() | CSS, Layout, Pseudo-class, Reference, Web |
The :lang() CSS pseudo-class matches elements based on the language they are determined to be in. |
||
212 | :last-child | CSS, Layout, Pseudo-class, Reference, Web |
The :last-child CSS pseudo-class represents the last element among a group of sibling elements. |
||
213 | :last-of-type | CSS, Layout, Pseudo-class, Reference, Web |
The :last-of-type CSS pseudo-class represents the last element of its type among a group of sibling elements. |
||
214 | :left | @page, CSS, Layout, Pseudo-class, Reference, Web |
The :left CSS pseudo-class, used with the @page at-rule, represents all left-hand pages of a printed document. |
||
215 | :link | CSS, Layout, Pseudo-class, Reference, Web |
The :link CSS pseudo-class represents an element that has not yet been visited. It matches every unvisited <a> , <area> , or <link> element that has an href attribute. |
||
216 | :not() | CSS, Layout, Pseudo-class, Reference, Web |
The :not() CSS pseudo-class represents elements that do not match a list of selectors. Since it prevents specific items from being selected, it is known as the negation pseudo-class. |
||
217 | :nth-child() | CSS, Layout, Pseudo-class, Reference, Web |
The :nth-child() CSS pseudo-class matches elements based on their position in a group of siblings. |
||
218 | :nth-last-child() | CSS, Layout, Pseudo-class, Reference, Web |
The :nth-last-child() CSS pseudo-class matches elements based on their position among a group of siblings, counting from the end. |
||
219 | :nth-last-of-type() | CSS, Layout, Pseudo-class, Reference, Web |
The :nth-last-of-type() CSS pseudo-class matches elements of a given type, based on their position among a group of siblings, counting from the end. |
||
220 | :nth-of-type() | CSS, Layout, Pseudo-class, Reference, Web |
The :nth-of-type() CSS pseudo-class matches elements of a given type, based on their position among a group of siblings. |
||
221 | :only-child | CSS, Layout, Pseudo-class, Reference, Web |
The :only-child CSS pseudo-class represents an element without any siblings. This is the same as :first-child:last-child or :nth-child(1):nth-last-child(1) , but with a lower specificity. |
||
222 | :only-of-type | CSS, Layout, Pseudo-class, Reference, Web |
The :only-of-type CSS pseudo-class represents an element that has no siblings of the same type. |
||
223 | :optional | CSS, Layout, Pseudo-class, Reference, Web |
The :optional CSS pseudo-class represents any <input> , <select> , or <textarea> element that does not have the required attribute set on it. |
||
224 | :out-of-range | CSS, Layout, Pseudo-class, Reference |
The :out-of-range CSS pseudo-class represents an <input> element whose current value is outside the range limits specified by the min and max attributes. |
||
225 | :placeholder-shown | CSS, Experimental, Pseudo-class, Reference |
The :placeholder-shown CSS pseudo-class represents any <input> or <textarea> element that is currently displaying placeholder text. |
||
226 | :read-only | CSS, Layout, Pseudo-class, Reference, Web |
The :read-only CSS pseudo-class represents an element (such as input or textarea ) that is not editable by the user. |
||
227 | :read-write | CSS, Layout, Pseudo-class, Reference, Web |
The :read-write CSS pseudo-class represents an element (such as input or textarea ) that is editable by the user. |
||
228 | :required | CSS, Layout, Pseudo-class, Reference, Web |
The :required CSS pseudo-class represents any <input> , <select> , or <textarea> element that has the required attribute set on it. |
||
229 | :right | @page, CSS, Layout, Pseudo-class, Reference, Web |
The :right CSS pseudo-class, used with the @page at-rule, represents all right-hand pages of a printed document. |
||
230 | :root | CSS, Layout, Pseudo-class, Reference, Web |
The :root CSS pseudo-class matches the root element of a tree representing the document. In HTML, :root represents the <html> element and is identical to the selector html , except that its specificity is higher. |
||
231 | :scope | :scope, CSS, Layout, Pseudo-class, Reference, Scoped Elements, Web |
The :scope CSS pseudo-class represents elements that are a reference point for selectors to match against. |
||
232 | :target | CSS, Layout, Pseudo-class, Reference, Web |
The :target CSS pseudo-class represents a unique element (the target element) with an id matching the URL's fragment. |
||
233 | :valid | CSS, Layout, Pseudo-class, Reference, Web |
The :valid CSS pseudo-class represents any <input> or other <form> element whose contents validate successfully. This allows to easily make valid fields adopt an appearance that helps the user confirm that their data is formatted properly. |
||
234 | :visited | CSS, Layout, Pseudo-class, Reference, Web |
The :visited CSS pseudo-class represents links that the user has already visited. For privacy reasons, the styles that can be modified using this selector are very limited. |
||
235 | :where() | :where, CSS, Experimental, Pseudo-class, Reference, Selectors, Web |
The :where() CSS pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list. |
||
236 | <angle-percentage> | CSS, CSS Data Type, Reference, angle-percentage, units, values |
The <angle-percentage> CSS data type represents a value that can be either a <angle> or a <percentage> . |
||
237 | <angle> | CSS, CSS Data Type, Layout, Reference, Web |
The <angle> CSS data type represents an angle value expressed in degrees, gradians, radians, or turns. It is used, for example, in <gradient> s and in some transform functions. |
||
238 | <basic-shape> | CSS, CSS Data Type, CSS Shapes, Reference |
The <basic-shape> CSS data type represents a shape used in the clip-path , shape-outside , and offset-path properties. |
||
239 | <blend-mode> | Blend modes, CSS, CSS Data Type, Compositing, Compositing and Blending, Reference |
The <blend-mode> CSS data type describes how colors should appear when elements overlap. It is used in the background-blend-mode and mix-blend-mode properties. |
||
240 | <color> | CSS, CSS Data Type, Layout, Reference, Web |
The <color> CSS data type represents a color in the sRGB color space. A <color> may also include an alpha-channel transparency value, indicating how the color should composite with its background. |
||
241 | <custom-ident> | CSS, CSS Data Type, Layout, Reference, Web |
The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity. |
||
242 | <display-box> | CSS, CSS Data Type, CSS Display, Reference, display-box |
These keywords define whether an element generates display boxes at all. | ||
243 | <display-inside> | CSS, CSS Data Type, CSS Display, Reference, display-inside |
These keywords specify the element’s inner display type, which defines the type of formatting context that lays out its contents (assuming it is a non-replaced element). These keywords are used as values of the display property, and can be used for legacy purposes as a single keyword, or as defined in the Level 3 specification alongside a value from the <display-outside> keywords. |
||
244 | <display-internal> | CSS, CSS Data Type, CSS Display, Reference, display-internal |
Some layout models such as table and ruby have a complex internal structure, with several different roles that their children and descendants can fill. This page defines those "internal" display values, which only have meaning within that particular layout mode. |
||
245 | <display-legacy> | CSS, CSS Data Type, CSS Display, Reference, display-legacy |
CSS 2 used a single-keyword syntax for the display property, requiring separate keywords for block-level and inline-level variants of the same layout mode. This page details those values. |
||
246 | <display-listitem> | CSS, CSS Data Type, CSS Display, Reference, display-listitem, list-item |
The list-item keyword causes the element to generate a ::marker pseudo-element with the content specified by its list-style properties (for example a bullet point) together with a principal box of the specified type for its own contents. |
||
247 | <display-outside> | CSS, CSS Data Type, CSS Display, Reference, display-outside |
The <display-outside> keywords specify the element’s outer display type, which is essentially its role in flow layout. These keywords are used as values of the display property, and can be used for legacy purposes as a single keyword, or as defined in the Level 3 specification alongside a value from the <display-inside> keywords. |
||
248 | <filter-function> | CSS, CSS Data Type, Filter Effects, NeedsCompatTable, Reference |
The <filter-function> CSS data type represents a graphical effect that can change the appearance of an input image. It is used in the filter and backdrop-filter properties. |
||
249 | blur() | CSS, CSS Function, Filter Effects, Reference |
The blur() CSS function applies a Gaussian blur to the input image. Its result is a <filter-function> . |
||
250 | brightness() | CSS, CSS Function, Filter Effects, Reference |
The brightness() CSS function applies a linear multiplier to the input image, making it appear brighter or darker. Its result is a <filter-function> . |
||
251 | contrast() | CSS, CSS Function, Filter Effects, Reference |
The contrast() CSS function adjusts the contrast of the input image. Its result is a <filter-function> . |
||
252 | drop-shadow() | CSS, CSS Function, Filter Effects, Reference |
The drop-shadow() CSS function applies a drop shadow effect to the input image. Its result is a <filter-function> . |
||
253 | grayscale() | CSS, CSS Function, Filter Effects, Reference |
The grayscale() CSS function converts the input image to grayscale. Its result is a <filter-function> . |
||
254 | hue-rotate() | CSS, CSS Function, Filter Effects, Reference |
The hue-rotate() CSS function rotates the hue of an element and its contents. Its result is a <filter-function> . |
||
255 | invert() | CSS, CSS Function, Filter Effects, Reference |
The invert() CSS function inverts the color samples in the input image. Its result is a <filter-function> . |
||
256 | opacity() | CSS, CSS Function, Filter Effects, Reference |
The opacity() CSS function applies transparency to the samples in the input image. Its result is a <filter-function> . |
||
257 | saturate() | CSS, CSS Function, Filter Effects, Reference |
The saturate() CSS function super-saturates or desaturates the input image. Its result is a <filter-function> . |
||
258 | sepia() | CSS, CSS Function, Filter Effects, Reference |
The sepia() CSS function converts the input image to sepia, giving it a warmer, more yellow/brown appearance. Its result is a <filter-function> . |
||
259 | url() | CSS, Junk, Reference |
The url() CSS function uses an SVG filter to change the appearance on the input image. |
||
260 | <flex> | CSS, CSS Data Type, Layout, Reference, Web |
The <flex> CSS data type denotes a flexible length within a grid container. It is used in grid-template-columns , grid-template-rows and other related properties. |
||
261 | <frequency-percentage> | CSS, CSS Data Type, Reference, frequency-percentage, units, values |
The <frequency-percentage> CSS data type represents a value that can be either a <frequency> or a <percentage> . |
||
262 | <frequency> | CSS, CSS Data Type, Layout, Reference, Web |
The <frequency> CSS data type represents a frequency dimension, such as the pitch of a speaking voice. It is not currently used in any CSS properties. |
||
263 | <gradient> | CSS, CSS Data Type, CSS Images, Graphics, Layout, Reference |
The <gradient> CSS data type is a special type of <image> that consists of a progressive transition between two or more colors. |
||
264 | <image> | CSS, CSS Data Type, CSS Images, Graphics, Layout, Reference, Web |
The <image> CSS data type represents a two-dimensional image. There are two kinds of images: plain images, referenced with a <url> , and dynamically-generated images, generated with <gradient> or element() . Additional CSS image functions include image() , image-set() , and cross-fade() . Images can be used with numerous CSS properties, such as background-image , border-image , content , cursor , and list-style-image . |
||
265 | <integer> | CSS, CSS Data Type, Reference, Web |
The <integer> CSS data type is a special type of <number> that represents a whole number, whether positive or negative. Integers can be used in numerous CSS properties, such as column-count , counter-increment , grid-column , grid-row , and z-index . |
||
266 | <length-percentage> | CSS, CSS Data Type, Reference, length-percentage, units, values |
The <length-percentage> CSS data type represents a value that can be either a <length> or a <percentage> . |
||
267 | <length> | CSS, CSS Data Type, Layout, Reference, Web, length |
The <length> CSS data type represents a distance value. Lengths can be used in numerous CSS properties, such as width , height , margin , padding , border-width , font-size , and text-shadow . |
||
268 | <number> | CSS, CSS Data Type, Layout, Reference, Web |
The <number> CSS data type represents a number, being either an integer or a number with a fractional component. |
||
269 | <percentage> | CSS, CSS Data Type, Layout, Reference, Web |
The <percentage> CSS data type represents a percentage value. It is often used to define a size as relative to an element's parent object. Numerous properties can use percentages, such as width , height , margin , padding , and font-size . |
||
270 | <position> | CSS, CSS Data Type, Layout, Reference, Web |
The <position> CSS data type denotes a two-dimensional coordinate used to set a location relative to an element box. It is used in the background-position property. |
||
271 | <ratio> | CSS, CSS Data Type, Layout, Reference, Web |
The <ratio> CSS data type, used for describing aspect ratios in media queries, denotes the proportion between two unitless values. |
||
272 | <resolution> | CSS, CSS Data Type, Layout, Reference, Web |
The <resolution> CSS data type, used for describing resolutions in media queries, denotes the pixel density of an output device, i.e., its resolution. |
||
273 | <shape> | CSS, CSS Data Type, CSS Function, Deprecated, Layout, Reference, Web |
The <shape> CSS data type defines the specific form (shape) of a region. The region represents the part of an element to which the clip property applies. |
||
274 | <string> | CSS, CSS Data Type, Layout, Reference, Web |
The <string> CSS data type represents a sequence of characters. Strings are used in numerous CSS properties, such as content , font-family , and quotes . |
||
275 | <time-percentage> | CSS, CSS Data Type, Reference, time-percentage, units, values |
The <time-percentage> CSS data type represents a value that can be either a <time> or a <percentage> . |
||
276 | <time> | CSS, CSS Data Type, Layout, Reference, Web |
The <time> CSS data type represents a time value expressed in seconds or milliseconds. It is used in animation , transition , and related properties. |
||
277 | <timing-function> | API, CSS, CSS Animations, CSS Data Type, CSS Transitions, Layout, Reference, timing-function |
The <timing-function> CSS data type denotes a mathematical function that describes how fast one-dimensional values change during animations. This lets you vary the animation's speed over the course of its duration. |
||
278 | <transform-function> | CSS, CSS Data Type, CSS Transforms, Layout, Reference |
The <transform-function> CSS data type represents a transformation that affects an element's appearance. Transformation functions can rotate, resize, distort, or move an element in 2D or 3D space. It is used in the transform property. |
||
279 | matrix() | CSS, CSS Function, CSS Transforms, Reference |
The matrix() CSS function defines a homogeneous 2D transformation matrix. Its result is a <transform-function> data type. |
||
280 | matrix3d() | CSS, CSS Function, CSS Transforms, NeedsExample, Reference |
The matrix3d() CSS function defines a 3D transformation as a 4x4 homogeneous matrix. Its result is a <transform-function> data type. |
||
281 | perspective() | CSS, CSS Function, CSS Transforms, Reference |
The perspective() CSS function defines a transformation that sets the distance between the user and the z=0 plane. Its result is a <transform-function> data type. |
||
282 | rotate() | CSS, CSS Function, CSS Transforms, Reference |
The rotate() CSS function defines a transformation that rotates an element around a fixed point on the 2D plane, without deforming it. Its result is a <transform-function> data type. |
||
283 | rotate3d() | CSS, CSS Function, CSS Transforms, Reference |
The rotate3d() CSS function defines a transformation that rotates an element around a fixed axis in 3D space, without deforming it. Its result is a <transform-function> data type. |
||
284 | rotateX() | CSS, CSS Function, CSS Transforms, Reference |
The rotateX() CSS function defines a transformation that rotates an element around the abscissa (horizontal axis) without deforming it. Its result is a <transform-function> data type. |
||
285 | rotateY() | CSS, CSS Function, CSS Transforms, Reference |
The rotateY() CSS function defines a transformation that rotates an element around the ordinate (vertical axis) without deforming it. Its result is a <transform-function> data type. |
||
286 | rotateZ() | CSS, CSS Function, CSS Transforms, Reference |
The rotateZ() CSS function defines a transformation that rotates an element around the z-axis without deforming it. Its result is a <transform-function> data type. |
||
287 | scale() | CSS, CSS Function, CSS Transforms, Reference |
The scale() CSS function defines a transformation that resizes an element on the 2D plane. Because the amount of scaling is defined by a vector, it can resize the horizontal and vertical dimensions at different scales. Its result is a <transform-function> data type. |
||
288 | scale3d() | CSS, CSS Function, CSS Transforms, Reference |
The scale3d() CSS function defines a transformation that resizes an element in 3D space. Because the amount of scaling is defined by a vector, it can resize different dimensions at different scales. Its result is a <transform-function> data type. |
||
289 | scaleX() | CSS, CSS Function, CSS Transforms, Reference |
The scaleX() CSS function defines a transformation that resizes an element along the x-axis (horizontally). Its result is a <transform-function> data type. |
||
290 | scaleY() | CSS, CSS Function, CSS Transforms, Reference, transform: rotateX(180deg);, transform: scaleY(-1); |
The scaleY() CSS function defines a transformation that resizes an element along the y-axis (vertically). Its result is a <transform-function> data type. |
||
291 | scaleZ() | CSS, CSS Function, CSS Transforms, Reference |
The scaleZ() CSS function defines a transformation that resizes an element along the z-axis. Its result is a <transform-function> data type. |
||
292 | skew() | CSS, CSS Function, CSS Transforms, Reference |
The skew() CSS function defines a transformation that skews an element on the 2D plane. Its result is a <transform-function> data type. |
||
293 | skewX() | CSS, CSS Function, CSS Transforms, Reference |
The skewX() CSS function defines a transformation that skews an element in the horizontal direction on the 2D plane. Its result is a <transform-function> data type. |
||
294 | skewY() | CSS, CSS Function, CSS Transforms, Reference |
The skewY() CSS function defines a transformation that skews an element in the vertical direction on the 2D plane. Its result is a <transform-function> data type. |
||
295 | translate() | CSS, CSS Function, CSS Transforms, Reference |
The translate() CSS function repositions an element in the horizontal and/or vertical directions. Its result is a <transform-function> data type. |
||
296 | translate3d() | CSS, CSS Function, CSS Transforms, Reference |
The translate3d() CSS function repositions an element in 3D space. Its result is a <transform-function> data type. |
||
297 | translateX() | CSS, CSS Function, CSS Transforms, Reference |
The translateX() CSS function repositions an element horizontally on the 2D plane. Its result is a <transform-function> data type. |
||
298 | translateY() | CSS, CSS Function, CSS Transforms, Reference |
The translateY() CSS function repositions an element vertically on the 2D plane. Its result is a <transform-function> data type. |
||
299 | translateZ() | 3D, CSS, CSS Function, CSS Transforms, Reference |
The translateZ() CSS function repositions an element along the z-axis in 3D space, i.e., closer to or farther away from the viewer. Its result is a <transform-function> data type. |
||
300 | <translation-value> | CSS, CSS Data Type, CSS Transforms, Reference |
The <translation-value> CSS data type is used in the arguments for certain transform functions, including translate() , translateX() , translateY() , and translate3d() . |
||
301 | <url> | CSS, CSS Data Type, Layout, Reference, URI, URL, urn |
The <url> CSS data type denotes a pointer to a resource, such as an image or a font. URLs can be used in numerous CSS properties, such as background-image , cursor , and list-style . |
||
302 | @charset | At-rule, CSS, Layout, Reference, Web |
The @charset CSS at-rule specifies the character encoding used in the style sheet. It must be the first element in the style sheet and not be preceded by any character; as it is not a nested statement, it cannot be used inside conditional group at-rules. If several @charset at-rules are defined, only the first one is used, and it cannot be used inside a style attribute on an HTML element or inside the <style> element where the character set of the HTML page is relevant. |
||
303 | @counter-style | At-rule, CSS, Reference, counter |
The @counter-style CSS at-rule lets you define counter styles that are not part of the predefined set of styles. A @counter-style rule defines how to convert a counter value into a string representation. |
||
304 | additive-symbols | @counter-style, CSS, CSS Counter Styles, CSS Descriptor, Reference |
The additive-symbols descriptor lets you specify symbols when the value of a counter system descriptor is additive . The additive-symbols descriptor defines additive tuples, each of which is a pair containing a symbol and a non-negative integer weight. The additive system is used to construct sign-value numbering systems such as Roman numerals. |
||
305 | fallback | @counter-style, CSS, CSS Counter Styles, CSS Descriptor, Reference |
The fallback descriptor can be used to specify a counter style to fall back to if the current counter style cannot create a marker representation for a particular counter value. |
||
306 | negative | @counter-style, CSS, CSS Descriptor, Reference |
When defining custom counter styles, the negative descriptor lets you alter the representations of negative counter values, by providing a way to specify symbols to be appended or prepended to the counter representation when the value is negative. |
||
307 | pad | @counter-style, CSS, CSS Counter Styles, CSS Descriptor, Reference |
The pad descriptor can be used with custom counter style definitions when you need the marker representations to have a minimum length. If a marker representation is smaller than the specified pad length, then the marker will be padded with the specified pad symbol. Marker representations longer than the pad length are constructed as normal. |
||
308 | prefix | @counter-style, CSS, CSS Counter Styles, CSS Descriptor, Reference |
The prefix descriptor of the @counter-style rule specifies content that will be prepended to the marker representation. If not specified, the default value will be "" (an empty string). |
||
309 | range | @counter-style, CSS, CSS Counter Styles, CSS Descriptor, Reference |
When defining custom counter styles, the range descriptor lets the author specify a range of counter values over which the style is applied. If a counter value is outside the specified range, then the fallback style will be used to construct the representation of that marker. |
||
310 | speak-as | @counter-style, CSS, CSS Descriptor, Reference |
The speak-as descriptor specifies how a counter symbol constructed with a given @counter-style will be represented in the spoken form. For example, an author can specify a counter symbol to be either spoken as its numerical value or just represented with an audio cue. |
||
311 | suffix | @counter-style, CSS, CSS Counter Styles, CSS Descriptor, Reference |
The suffix descriptor of the@counter-style rule specifies content that will be appended to the marker representation. If not specified, the default value will be "\2E\20" (". ", a full stop followed by a space). |
||
312 | symbols | @counter-style, CSS, CSS Counter Styles, CSS Descriptor, Reference |
The symbols CSS descriptor is used to specify the symbols that the specified counter system will use to construct counter representations. A symbol can be a string, image, or identifier. It is used within the @counter-style at-rule. |
||
313 | system | @counter-style, CSS, CSS Counter Styles, CSS Descriptor, Reference |
The system descriptor specifies the algorithm to be used for converting the integer value of a counter to a string representation. It is used in a @counter-style to define the behavior of the defined style. |
||
314 | @document | At-rule, CSS, Reference |
The @document CSS at-rule restricts the style rules contained within it based on the URL of the document. It is designed primarily for user-defined style sheets, though it can be used on author-defined style sheets, too. |
||
315 | @font-face | @font-face, At-rule, CSS, CSS Fonts, Fonts, Reference, typography |
The @font-face CSS at-rule specifies a custom font with which to display text; the font can be loaded from either a remote server or a locally-installed font on the user's own computer. |
||
316 | font-display | @font-face, CSS, CSS Descriptor, CSS Fonts, Experimental, Fonts, Reference, font-display, web fonts |
The font-display descriptor determines how a font face is displayed based on whether and when it is downloaded and ready to use. |
||
317 | font-family | @font-face, CSS, CSS Descriptor, CSS Fonts, Reference |
The font-family CSS descriptor allows authors to specify the font family for the font specified in an @font-face rule. |
||
318 | font-style | @font-face, CSS, CSS Descriptor, CSS Fonts, Reference |
The font-style CSS descriptor allows authors to specify font styles for the fonts specified in the @font-face rule. |
||
319 | font-variation-settings | @font-face, CSS, CSS Descriptor, CSS Fonts, Reference |
The font-variation-settings CSS descriptor allows authors to specify low-level OpenType or TrueType font variations in the @font-face rule. |
||
320 | src | @font-face, CSS, CSS Descriptor, CSS Fonts, Reference |
The src CSS descriptor of the @font-face rule specifies the resource containing font data. It is required for the @font-face rule to be valid. |
||
321 | unicode-range | CSS, CSS Fonts, CSS Property, Experimental, Layout, Reference, Web |
The unicode-range CSS descriptor sets the specific range of characters to be used from a font defined by @font-face and made available for use on the current page. If the page doesn't use any character in this range, the font is not downloaded; if it uses at least one, the whole font is downloaded. |
||
322 | @font-feature-values | At-rule, CSS, CSS Fonts, Reference |
The @font-feature-values CSS at-rule lets you use a common name in the font-variant-alternates property for features activated differently in OpenType. This can help simplify your CSS when using multiple fonts. |
||
323 | @import | At-rule, CSS, CSS Conditional Rules, Reference |
The @import CSS at-rule is used to import style rules from other style sheets. These rules must precede all other types of rules, except @charset rules; as it is not a nested statement, @import cannot be used inside conditional group at-rules. |
||
324 | @keyframes | Animations, At-rule, CSS, Reference |
The @keyframes CSS at-rule controls the intermediate steps in a CSS animation sequence by defining styles for keyframes (or waypoints) along the animation sequence. |
||
325 | @media | @media, At-rule, CSS, Reference |
The @media CSS at-rule can be used to apply part of a style sheet based on the result of one or more media queries. |
||
326 | -moz-device-pixel-ratio | @media, CSS, Deprecated, Non-standard, media feature |
The -moz-device-pixel-ratio Gecko-only CSS media feature can be used to apply styles based on the number of device pixels per CSS pixel. |
||
327 | -moz-mac-graphite-theme | -moz-mac-graphite-theme, @media, CSS, CSS:Mozilla Extensions, Non-standard, media feature |
The -moz-mac-graphite-theme Gecko-only CSS media feature can be used to apply styles based on whether the user has the Mac OS X "Graphite" theme enabled. |
||
328 | -moz-maemo-classic | -moz-maemo-classic, @media, CSS, CSS:Mozilla Extensions, Non-standard, media feature |
The -moz-maemo-classic Gecko-only CSS media feature can be used to apply styles based on whether the user agent is using the original Maemo theme. |
||
329 | -moz-os-version | @media, CSS, Non-standard, media feature |
The -moz-os-version Gecko-only CSS media feature can be used to apply styles based on the user's version of Microsoft Windows. This can be useful for adapting application skins and other chrome code depending on the user's operating system version. |
||
330 | -moz-scrollbar-end-backward | -moz-scrollbar-end-backward, @media, CSS, CSS:Mozilla Extensions, Non-standard, media feature |
If the device's user interface displays a backward arrow button at the end of scrollbars, this is 1. Otherwise it's 0. | ||
331 | -moz-scrollbar-end-forward | -moz-scrollbar-end-forward, @media, CSS, CSS:Mozilla Extensions, Non-standard, media feature |
If the device's user interface displays a forward arrow button at the end of scrollbars, this is 1. Otherwise it's 0. | ||
332 | -moz-scrollbar-start-backward | -moz-scrollbar-start-backward, @media, CSS, Mozilla, Non-standard, media feature |
If the device's user interface displays a backward arrow button at the beginning of scrollbars, this is 1. Otherwise it's 0. | ||
333 | -moz-scrollbar-start-forward | -moz-scrollbar-start-forward, @media, CSS, CSS:Mozilla Extensions, Non-standard, media feature |
If the device's user interface displays a forward arrow button at the beginning of scrollbars, this is 1. Otherwise it's 0. | ||
334 | -moz-scrollbar-thumb-proportional | -moz-scrollbar-thumb-proportional, @media, CSS, CSS:Mozilla Extensions, Non-standard, media feature |
If the device's user interface displays the thumb of scrollbars proportionally (that is, sized based on the percentage of the document that is visible), this is 1. Otherwise it's 0. | ||
335 | -moz-touch-enabled | -moz-touch-enabled, @media, CSS, CSS:Mozilla Extensions, Non-standard, media feature |
If the device supports touch events (for a touch screen), this is 1. Otherwise it's 0. | ||
336 | -moz-windows-accent-color-in-titlebar | -moz-windows-accent-color-in-titlebar, @media, CSS, CSS:Mozilla Extensions, Non-standard, media feature |
The -moz-windows-accent-color-in-titlebar Gecko-only CSS media feature can be used to apply styles based on whether accent colors are enabled in Microsoft Windows titlebars. | ||
337 | -moz-windows-classic | -moz-windows-classic, @media, CSS, CSS:Mozilla Extensions, Non-standard, media feature |
If the user is using Windows unthemed (in classic mode instead of using uxtheme), this is 1. Otherwise it's 0. | ||
338 | -moz-windows-compositor | @media, CSS, Non-standard, media feature |
Media: media/visual Accepts min/max prefixes: no |
||
339 | -moz-windows-default-theme | @media, CSS, Non-standard, media feature |
If the user is using one of the default Windows themes—Luna, Royale, Zune, or Aero (including Vista Basic, Vista Advanced, and Aero Glass)—this is 1. Otherwise it's 0. | ||
340 | -moz-windows-glass | -moz-windows-glass, @media, CSS, CSS:Mozilla Extensions, Mozilla, Non-standard, media feature |
If the user is using Windows Glass theme, this is 1; otherwise it's 0. Note that this only exists for Windows 7 and earlier. | ||
341 | -moz-windows-theme | -moz-windows-theme, @media, CSS, CSS:Mozilla Extensions, Non-standard, media feature |
The -moz-windows-theme Gecko-only CSS media feature is useful for customizing application skins and other chrome code to work well with the user's Windows theme. |
||
342 | -ms-high-contrast | @media, CSS, Non-standard, Reference, media feature |
The -ms-high-contrast CSS media feature is a Microsoft extension that describes whether the application is being displayed in high contrast mode, and with what color variation. | ||
343 | -webkit-animation | @media, CSS, Reference, WebKit, media feature |
The -webkit-animation Boolean CSS media feature is a Chrome extension whose value is true if vendor-prefixed CSS animation s are supported. |
||
344 | -webkit-device-pixel-ratio | @media, CSS, NeedsBrowserCompatibility, Non-standard, WebKit, media feature |
The -webkit-device-pixel-ratio is a non-standard Boolean CSS media feature which is an alternative to the standard resolution media feature. |
||
345 | -webkit-transform-2d | @media, CSS, Non-standard, Reference, WebKit, media feature |
The -webkit-transform-2d Boolean CSS media feature is a Chrome extension whose value is true if vendor-prefixed CSS 2D transform s are supported. |
||
346 | -webkit-transform-3d | @media, CSS, Non-standard, Reference, WebKit, media feature |
The -webkit-transform-3d Boolean CSS media feature is a Chrome extension whose value is true if vendor-prefixed CSS 3D transform s are supported. |
||
347 | -webkit-transition | @media, Blink, CSS, Deprecated, Non-standard, Reference, WebKit, media feature |
The -webkit-transition Boolean CSS media feature is a Chrome extension whose value is true if the browsing context supports CSS transitions. It was never supported in browsers not based on WebKit or Blink. |
||
348 | Index | @media, CSS, Index |
Found 52 pages: | ||
349 | any-hover | @media, CSS, Media Queries, Reference, media feature |
The any-hover CSS media feature can be used to test whether any available input mechanism can hover over elements. |
||
350 | any-pointer | @media, CSS, Media Queries, Reference, media feature |
The any-pointer CSS media feature tests whether the user has any pointing device (such as a mouse), and if so, how accurate it is. |
||
351 | aspect-ratio | @media, CSS, Media Queries, Reference, media feature |
The aspect-ratio CSS media feature can be used to test the aspect ratio of the viewport. |
||
352 | aural | CSS, Deprecated, Reference |
The aural CSS media type is used for devices that have speech output capabilities. |
||
353 | color | @media, CSS, Media Queries, Reference, media feature |
The color CSS media feature can be used to test the number of bits per color component (red, green, blue) of the output device. |
||
354 | color-gamut | @media, CSS, Media Queries, Reference, media feature |
The color-gamut CSS media feature can be used to test the approximate range of colors that are supported by the user agent and the output device. |
||
355 | color-index | @media, CSS, Media Queries, Reference, media feature |
The color-index CSS media feature can be used to test the number of entries in the output device's color lookup table. |
||
356 | device-aspect-ratio | @media, CSS, Deprecated, Media Queries, Reference, Web, media feature |
The device-aspect-ratio CSS media feature can be used to test the width-to-height aspect ratio of an output device. |
||
357 | device-height | @media, CSS, Deprecated, Media Queries, Reference, media feature |
The device-height CSS media feature can be used to test the height of an output device's rendering surface. |
||
358 | device-width | @media, CSS, Deprecated, Media Queries, Reference, media feature |
The device-width CSS media feature can be used to test the width of an output device's rendering surface. |
||
359 | display-mode | @media, CSS, Media Queries, Reference, display, display-mode, media feature, web app manifest |
The display-mode CSS media feature can be used to test the display mode of an application. You can use it to provide a consistent user experience between launching a site from a URL and launching it from a desktop icon. |
||
360 | grid | @media, CSS, Media Queries, Reference, media feature |
The grid CSS media feature can be used to test whether the output device uses a grid-based screen. |
||
361 | height | @media, CSS, Media Queries, Reference, media feature |
The height CSS media feature can be used to apply styles based on the height of the viewport (or the page box, for paged media). |
||
362 | hover | @media, CSS, Media Queries, Reference, media feature |
The hover CSS media feature can be used to test whether the user's primary input mechanism can hover over elements. |
||
363 | inverted-colors | @media, CSS, Media Queries, Reference, media feature |
The inverted-colors CSS media feature can be used to test whether the user agent or underlying OS is inverting colors. |
||
364 | light-level | @media, CSS, Media Queries, Reference, media feature |
The light-level CSS media feature can be used to test the ambient light level. |
||
365 | monochrome | @media, CSS, Media Queries, Reference, media feature |
The monochrome CSS media feature can be used to test the number of bits per pixel in the monochrome frame buffer of the output device. |
||
366 | orientation | @media, CSS, Media Queries, NeedsBrowserCompatibility, Reference, media feature |
The orientation CSS media feature can be used to test the orientation of the viewport (or the page box, for paged media). |
||
367 | overflow-block | @media, CSS, Media Queries, Reference, media feature |
The overflow-block CSS media feature can be used to test how the output device handles content that overflows the initial containing block along the block axis. |
||
368 | overflow-inline | @media, CSS, Media Queries, Reference, media feature |
The overflow-inline CSS media feature can be used to test how the output device handles content that overflows the initial containing block along the inline axis. |
||
369 | pointer | @media, CSS, Media Queries, Reference, media feature |
The pointer CSS media feature tests whether the user has a pointing device (such as a mouse), and if so, how accurate the primary pointing device is. |
||
370 | prefers-color-scheme | @media, CSS, Reference, prefers-color-scheme |
No summary! | ||
371 | prefers-reduced-motion | @media, CSS, Media Queries, Reference, media feature |
The prefers-reduced-motion CSS media feature is used to detect if the user has requested that the system minimize the amount of animation or motion it uses. |
||
372 | resolution | @media, CSS, Media Queries, Reference, media feature |
The resolution CSS media feature can be used to test the pixel density of the output device. |
||
373 | scan | @media, CSS, Media Queries, Reference, media feature |
The scan CSS media feature can be used to test the scanning process (if any) utilized by the output device. The word scanning used in this context does not refer to an image scanner, such as one used to digitize a photograph. Rather, it means the process by which an image is painted onto a television screen (or other device). |
||
374 | scripting | @media, CSS, Media Queries, Reference, media feature |
The scripting CSS media feature can be used to test whether scripting (such as JavaScript) is available. |
||
375 | update | @media, CSS, Media Queries, Reference, media feature |
The update CSS media feature can be used to test how frequently (if at all) the output device is able to modify the appearance of content. |
||
376 | width | @media, CSS, Media Queries, Reference, media feature |
The width CSS media feature can be used to test the width of the viewport (or the page box, for paged media). |
||
377 | @namespace | At-rule, CSS, CSS Namespaces, Layout, Reference, Web |
@namespace is an at-rule that defines XML namespaces to be used in a CSS style sheet. The defined namespaces can be used to restrict the universal, type, and attribute selectors to only select elements within that namespace. The @namespace rule is generally only useful when dealing with documents containing multiple namespaces—such as HTML5 with inline SVG or MathML, or XML that mixes multiple vocabularies. |
||
378 | @page | @page, At-rule, CSS, Layout, Reference, Web |
The @page CSS at-rule is used to modify some CSS properties when printing a document. You can't change all CSS properties with @page . You can only change the margins, orphans, widows, and page breaks of the document. Attempts to change any other CSS properties will be ignored. |
||
379 | bleed | @page, CSS, CSS Descriptor, Experimental, NeedsBrowserCompatibility, NeedsMobileBrowserCompatibility, Reference, Web |
The bleed CSS at-rule descriptor, used with the @page at-rule, specifies the extent of the page bleed area outside the page box. This property only has effect if crop marks are enabled using the marks property. |
||
380 | marks | @page, CSS, CSS Descriptor, Experimental, Layout, Reference, Web |
The marks CSS at-rule descriptor, used with the @page at-rule, adds crop and/or cross marks to the presentation of the document. Crop marks indicate where the page should be cut. Cross marks are used to align sheets. |
||
381 | size | @page, CSS, CSS Descriptor, Experimental, NeedsBrowserCompatibility, Reference, Web |
The size CSS at-rule descriptor, used with the @page at-rule, defines the size and orientation of the box which is used to represent a page. Most of the time, this size corresponds to the target size of the printed page if applicable. |
||
382 | @styleset | CSS, NeedsContent, Reference, Web |
See @font-feature-values . |
||
383 | @supports | At-rule, CSS, Layout, Reference, Web, supports |
The @supports CSS at-rule lets you specify declarations that depend on a browser's support for one or more specific CSS features. This is called a feature query. The rule may be placed at the top level of your code or nested inside any other conditional group at-rule. |
||
384 | @viewport | @viewport, At-rule, CSS, Experimental, Layout, Mobile, Reference, Screen Layout, viewport |
The @viewport CSS at-rule lets you configure the viewport through which the document is viewed. It's primarily used for mobile devices, but is also used by desktop browsers that support features like "snap to edge" (such as Microsoft Edge). |
||
385 | height | @viewport, CSS, CSS Descriptor, Reference |
The height CSS descriptor is a shorthand descriptor for setting both min-height and max-height of the viewport. by providing one viewport length value will set both, the minimum height and the maximum height, to the value provided. |
||
386 | max-height | @viewport, CSS, CSS Descriptor, Reference |
The max-height CSS descriptor specifies the maximum height of the viewport of a document defined via the @viewport at-rule. |
||
387 | max-width | @viewport, CSS, CSS Descriptor, Reference |
The max-width CSS descriptor specifies the maximum width of the viewport of a document defined via the @viewport at-rule. |
||
388 | max-zoom | @viewport, CSS, CSS Descriptor, NeedsExample, Reference |
The max-zoom CSS descriptor sets the maximum zoom factor of a document defined by the @viewport at-rule. The browser will not zoom in any further than this, whether automatically or at the user's request. |
||
389 | min-height | @viewport, CSS, CSS Descriptor, Reference |
The min-height CSS descriptor specifies the minimum height of the viewport of a document defined via the @viewport at-rule. |
||
390 | min-width | @viewport, CSS, CSS Descriptor, Reference |
The min-width CSS descriptor specifies the minimum width of the viewport of a document defined via @viewport . |
||
391 | min-zoom | @viewport, CSS, CSS Descriptor, NeedsExample, Reference |
The min-zoom CSS descriptor sets the minimum zoom factor of a document defined by the @viewport at-rule. The browser will not zoom out any further than this, whether automatically or at the user's request. |
||
392 | orientation | @viewport, CSS, CSS Descriptor, NeedsExample, Reference |
The orientation CSS descriptor controls the orientation of a document defined by @viewport . |
||
393 | user-zoom | @viewport, CSS, CSS Descriptor, Graphics, Layout, NeedsBrowserCompatibility, NeedsExample, Reference, Web |
The user-zoom CSS descriptor controls whether or not the user can change the zoom factor of a document defined by @viewport . |
||
394 | viewport-fit | @viewport, CSS, CSS Descriptor, Experimental, Mobile, NeedsData.json, NeedsExample, Reference, Screen Layout |
The viewport-fit CSS @viewport descriptor controls how a document's viewport fills the screen. |
||
395 | width | @viewport, CSS, CSS Descriptor, Reference |
The width CSS descriptor is shorthand for setting both the min-width and the max-width of the viewport. By providing one viewport length value, that value will determine both the min-width and the max-width to the value provided. | ||
396 | zoom | @viewport, CSS, CSS Descriptor, Graphics, Layout, NeedsExample, Reference, Web |
The zoom CSS descriptor sets the initial zoom factor of a document defined by the @viewport at-rule. |
||
397 | Actual value | CSS, Reference |
The actual value of a CSS property is the used value of that property after any necessary approximations have been applied. For example, a user agent that can only render borders with a whole-number pixel width may round the thickness of the border to the nearest integer. | ||
398 | Adjacent sibling combinator | CSS, NeedsMobileBrowserCompatibility, Reference, Selectors |
The adjacent sibling combinator (+ ) separates two selectors and matches the second element only if it immediately follows the first element, and both are children of the same parent element . |
||
399 | Alternative style sheets | CSS, HTML, NeedsCompatTable, NeedsUpdate, Reference |
Specifying alternative style sheets in a web page provides a way for users to see multiple versions of a page, based on their needs or preferences. | ||
400 | Animatable CSS properties | CSS, CSS Animations, CSS Transitions, Reference |
Certain CSS properties can be animated using CSS Animations or CSS Transitions. Animation means that their values can be made to change gradually over a given amount of time. | ||
401 | At-rule | At-rule, CSS, Reference |
An at-rule is a CSS statement that instructs CSS how to behave. They begin with an at sign, '@ ' (U+0040 COMMERCIAL AT ), followed by an identifier and includes everything up to the next semicolon, '; ' (U+003B SEMICOLON ), or the next CSS block, whichever comes first. |
||
402 | Attribute selectors | Attribute, Attribute selectors, CSS, CSS 3, CSS 3 Attribute selectors, CSS Attributes, Identifying Elements, Identifying Nodes, Reference, Selecting Elements, Selecting Nodes, Selectors |
The CSS attribute selector matches elements based on the presence or value of a given attribute. | ||
403 | CSS Animations | CSS, CSS Animations, Overview, Reference |
CSS Animations is a module of CSS that lets you animate the values of CSS properties over time, using keyframes. The behavior of these keyframe animations can be controlled by specifying their timing function, duration, their number of repetitions, and other attributes. | ||
404 | CSS Animations tips and tricks | CSS, CSS Animations, Example, Guide, Reference |
CSS Animations make it possible to do incredible things with the elements that make up your documents and apps. However, there are things you might want to do that aren't obvious, or clever ways to do things that you might not come up with right away. This article is a collection of tips and tricks we've found that may make your work easier, including how to run a stopped animation again. | ||
405 | Detecting CSS animation support | Advanced, CSS, CSS Animations, Guide, JavaScript, Junk, Reference |
CSS animations make it possible to do creative animations of content using nothing but CSS. However, there are likely to be times when this feature isn't available, and you may wish to handle that case by using JavaScript code to simulate a similar effect. This article, based on this blog post by Chris Heilmann, demonstrates a technique for doing this. | ||
406 | Using CSS animations | Advanced, CSS, CSS Animations, Example, Guide |
CSS animations make it possible to animate transitions from one CSS style configuration to another. | ||
407 | CSS Backgrounds and Borders | CSS, CSS Backgrounds and Borders, Overview, Reference |
CSS Backgrounds and Borders is a module of CSS that lets you style elements' backgrounds and borders. Backgrounds can be filled with a color or image, clipped or resized, and otherwise modified. Borders can be decorated with lines or images, and made square or rounded. Additionally, element boxes can be decorated with a shadow. | ||
408 | Scaling background images | CSS, CSS Background, Example, Guide, Intermediate, Reference, Web |
The background-size CSS property makes it possible to adjust the width and height of background images, thus overriding the default behavior which tiles background images at their full size. |
||
409 | Using multiple backgrounds | CSS, CSS Background, Example, Guide, Reference |
You can apply multiple backgrounds to elements. These are layered atop one another with the first background you provide on top and the last background listed in the back. | ||
410 | CSS Basic Box Model | CSS, CSS Box Model, Overview, Reference |
CSS Basic Box Model is a module of CSS that defines the rectangular boxes—including their padding and margin—that are generated for elements and laid out according to the visual formatting model. | ||
411 | Introduction to the CSS basic box model | CSS, CSS Box Model, Guide, Layout, Position, box, box model, height, size, width |
When laying out a document, the browser's rendering engine represents each element as a rectangular box according to the standard CSS basic box model. CSS determines the size, position, and properties (color, background, border size, etc.) of these boxes. | ||
412 | Mastering margin collapsing | CSS, CSS Box Model, Guide, Reference |
The top and bottom margins of blocks are sometimes combined (collapsed) into a single margin whose size is the largest of the individual margins (or just one of them, if they are equal), a behavior known as margin collapsing. Note that the margins of floating and absolutely positioned elements never collapse. | ||
413 | CSS Basic User Interface | CSS, CSS Basic User Interface, Overview, Reference |
CSS Basic User Interface is a CSS module that lets you define the rendering and functionality of features related to the user interface. | ||
414 | Using URL values for the cursor property | CSS, Gecko, Guide, NeedsUpdate, Reference |
Gecko 1.8 (Firefox 1.5 / SeaMonkey 1.0) supports URL values for the CSS cursor property on Windows and Linux. Mac support was added in Gecko 2 (Firefox 4). This allows specifying arbitrary images as mouse cursors — any image format supported by Gecko can be used. |
||
415 | CSS Box Alignment | CSS, CSS Box Alignment, Grid Layout, alignment, box alignment, flexbox, multi-column |
The CSS Box Alignment module specifies CSS features that relate to the alignment of boxes in the various CSS box layout models: block layout, table layout, flex layout, and grid layout. The module aims to create a consistent method of alignment across all of CSS. This document details the general concepts found in the specification. | ||
416 | Box alignment for block, absolutely positioned and table layout | Block, CSS, absolutely positioned, box alignment, table |
The Box Alignment Specification details how alignment works in various layout methods. In this page we explore how box alignment works in the context of block layout, including floated, positioned, and table elements. As this page aims to detail things which are specific to block layout and box alignment, it should be read in conjunction with the main Box Alignment page, which details the common features of box alignment across layout methods. | ||
417 | Box alignment in Flexbox | CSS, box alignment, flexbox |
The Box Alignment Specification details how alignment works in various layout methods; on this page we explore how box alignment works in the context of Flexbox. As this page aims to detail things which are specific to Flexbox and box alignment, it should be read in conjunction with the main Box Alignment page which details the common features of box alignment across layout methods. | ||
418 | Box alignment in Multi-column Layout | CSS, box alignment, multi-column |
The Box Alignment Specification details how alignment works in various layout methods; on this page we explore how Box Alignment works in the context of Multi-column Layout. As this page aims to detail things which are specific to Multi-column Layout and Box Alignment, it should be read in conjunction with the main Box Alignment page which details the common features of Box Alignment across layout methods. | ||
419 | Box alignment in grid layout | CSS, box alignment, grid |
The Box Alignment specification details how alignment works in various layout methods. On this page we explore how box alignment works in the context of CSS Grid Layout. | ||
420 | CSS Charsets | CSS, CSS Charsets, Overview, Reference |
CSS Charsets is a module of CSS that lets you specify the character set used in the style sheet. | ||
421 | CSS Color | CSS, CSS Colors, HTML Colors, Overview, Reference, Styles, Styling HTML, colors |
CSS Color is a CSS module that deals with colors, color types, color blending, opacity, and how you can apply these colors and effects to HTML content. | ||
422 | CSS Conditional Rules | CSS, CSS Conditional Rules, Overview, Reference |
CSS Conditional Rules is a CSS module that allows to define a set of rules that will only apply based on the capabilities of the processor or the document the style sheet is being applied to. | ||
423 | CSS Counter Styles | CSS, CSS Counter Styles, NeedsContent, Overview, Reference |
CSS Counter Styles is a module of CSS that lets you define your own counter styles. | ||
424 | CSS Custom Properties for Cascading Variables | CSS, CSS Variables, Overview, Reference |
CSS Custom Properties for Cascading Variables is a CSS module that allows for the creation of custom properties that can be used over and over. | ||
425 | CSS Device Adaptation | CSS, CSS Device Adaptation, Overview, Reference |
CSS Device Adaptation is a module of CSS that lets you define the size, zoom factor, and orientation of the viewport. | ||
426 | CSS Display | CSS, CSS Display, Overview, Reference |
CSS Display is a module of CSS that defines how the CSS formatting box tree is generated from the document element tree and defines properties controlling it. | ||
427 | CSS Flexible Box Layout | CSS, CSS Flexible Boxes, Overview, Reference |
CSS Flexible Box Layout is a module of CSS that defines a CSS box model optimized for user interface design, and the layout of items in one dimension. In the flex layout model, the children of a flex container can be laid out in any direction, and can “flex” their sizes, either growing to fill unused space or shrinking to avoid overflowing the parent. Both horizontal and vertical alignment of the children can be easily manipulated. | ||
428 | Aligning Items in a Flex Container | Align, CSS, Flex, Guide, align-content, align-items, align-self, alignment, flexbox, justify, justify-content |
One of the reasons that flexbox quickly caught the interest of web developers is that it brought proper alignment capabilities to the web for the first time. It enabled proper vertical alignment, so we can at last easily center a box. In this guide, we will take a thorough look at how the alignment and justification properties work in Flexbox. | ||
429 | Backwards Compatibility of Flexbox | @supports, CSS, CSS Tables, Flexible Boxes, Floats, fallbacks, feature queries, flexbox, inline-block |
Flexbox is very well supported across modern browsers, however there are a few issues that you might run into. In this guide we will look at how well flexbox is supported in browsers, and look at some potential issues, resources and methods for creating workarounds and fallbacks. | ||
430 | Basic concepts of flexbox | CSS, Flex, Guide, axes, concepts, container, flexbox |
The Flexible Box Module, usually referred to as flexbox, was designed as a one-dimensional layout model, and as a method that could offer space distribution between items in an interface and powerful alignment capabilities. This article gives an outline of the main features of flexbox, which we will be exploring in more detail in the rest of these guides. | ||
431 | Controlling Ratios of Flex Items Along the Main Axis | Basis, CSS, Flex, Guide, flexbox, free space, grow, max-content, min-content, shrink, space |
In this guide we will be exploring the three properties that are applied to flex items, which enable us to control the size and flexibility of the items along the main axis — flex-grow , flex-shrink , and flex-basis . Fully understanding how these properties work with growing and shrinking items is the real key to mastering flexbox. |
||
432 | Cross-browser Flexbox mixins | CSS, CSS Flexible Boxes, Reference, mixins |
This article provides a set of mixins for those who want to mess around with flexbox using the native support of current browsers. | ||
433 | Mastering Wrapping of Flex Items | CSS, Flex, Guide, collapsed items, flexbox, grid, wrapping |
Flexbox was designed as a single dimensional layout, meaning that it deals with laying out items as a row or as a column — but not both at once. There is however the ability to wrap flex items onto new lines, creating new rows if flex-direction is row and new columns if flex-direction is column . In this guide I will explain how this works, what it is designed for and what situations really require CSS Grid Layout rather than flexbox. |
||
434 | Ordering Flex Items | Accessibility, CSS, Flex, Guide, direction, flexbox, order, reverse |
New layout methods such as Flexbox and Grid bring with them the possibility of controlling the order of content. In this article we will take a look at ways in which you can change the visual order of your content when using Flexbox. We will also consider the implications of reordering items from an accessibility point of view. | ||
435 | Relationship of flexbox to other layout methods | CSS, Guide, Writing Mode, box alignment, contents, display, flexbox, grid |
In this article we will take a look at how Flexbox fits in with all the other CSS modules. We’ll find out which specifications you also need to take notice of if you want to learn flexbox, and find out why flexbox is different to some other modules. | ||
436 | Typical use cases of Flexbox | CSS, Flexible Box, Guide, common uses, flexbox, patterns |
In this guide we will take a look at some of the common use cases for flexbox — those places where it makes more sense than another layout method. | ||
437 | CSS Flow Layout | CSS, CSS Flow Layout, Guide, Intermediate, Layout, Reference, flow |
Normal Flow, or Flow Layout, is the way that Block and Inline elements are displayed on a page before any changes are made to their layout. The flow is essentially a set of things that are all working together and know about each other in your layout. Once something is taken out of flow it works independently. | ||
438 | Block and Inline Layout in Normal Flow | CSS, CSS Flow Layout, Guide, Intermediate, Layout, Margins, flow |
In this guide we have looked at how elements display in normal flow, as block and inline elements. Due to the default behaviour of these elements, an HTML document with no CSS styling at all, will display in a readable way. By understanding how normal flow works you will find layout easier, as you understand the starting point for making changes to how elements are displayed. | ||
439 | Flow Layout and Overflow | CSS, Flow Layout, Guide, Intermediate, Layout, Visibility, overflow, text-overflow |
Whether you are in continuous media on the web or in a Paged Media format such as print or EPUB, understanding how content overflows is useful when dealing with any layout method. By understanding how overflow works in normal flow, you should find it easier to understand the implications of overflow content in layout methods such as grid and flexbox. | ||
440 | Flow Layout and Writing Modes | CSS, Flow Layout, Guide, Orientation, Writing-mode |
In most cases, flow layout works as you would expect it to when changing the writing mode of the document or parts of the document. This can be used to properly typeset vertical languages or for creative reasons. CSS is making this easier by way of introducing logical properties and values so that when working in a vertical writing mode sizing can be based on element's inline and block size. This will be useful when creating components which can work in different writing-modes. | ||
441 | Formatting Contexts Explained | Block Formatting Context, CSS, Guide, Intermediate, Layout, flow |
In this guide, we have looked in more detail at the Block and Inline formatting contexts and the important subject of creating a Block Formatting Context (BFC). In the next guide, we will find out how normal flow interacts with different writing modes. | ||
442 | In Flow and Out of Flow | CSS, CSS Flow Layout, Flow Layout, Guide, Intermediate, Layout, flow |
In this guide we have covered the ways to take an element out of flow in order to achieve some very specific types of positioning. In the next guide we will look at a related issue, that of creating a Block Formatting Context, in Formatting Contexts Explained. | ||
443 | CSS Fonts | CSS, CSS Fonts, Overview, Reference |
CSS Fonts is a module of CSS that defines font-related properties and how font resources are loaded. It lets you define the style of a font, such as its family, size and weight, line height, and the glyph variants to use when multiple are available for a single character. | ||
444 | OpenType font features guide | CSS, Fonts, Text, font-feature-settings, opentype |
Font features or variants refer to different glyphs or character styles contained within an OpenType font. These include things like ligatures (special glyphs that combine characters like 'fi' or 'ffl'), kerning (adjustments to the spacing between specific letterform pairings), fractions, numeral styles, and a number of others. These are all referred to as OpenType Features, and are made available to use on the web via specific properties and a low-level control property — font-feature-settings . This article provides you with all you need to know about using OpenType font features in CSS. |
||
445 | Variable fonts guide | CSS, Fonts, Text, variable fonts, web fonts |
Variable fonts are an evolution of the OpenType font specification that enables many different variations of a typeface to be incorporated into a single file, rather than having a separate font file for every width, weight, or style. They let you access all the variations contained in a given font file via CSS and a single @font-face reference. This article will give you all you need to know to get you started using variable fonts. |
||
446 | CSS Fragmentation | CSS, CSS Fragmentation, NeedsCompatTable, NeedsContent, Overview, Reference |
CSS Fragmentation is a module of CSS that defines how content is displayed when it is broken (fragmented) across multiple pages, regions, or columns. | ||
447 | CSS Generated Content | CSS, CSS Generated Content, Overview, Reference |
CSS Generated Content is a module of CSS that defines how to add content to an element. | ||
448 | CSS Grid Layout | CSS, Grid Layout, Grids, Layout, Overview, Reference |
CSS Grid Layout excels at dividing a page into major regions or defining the relationship in terms of size, position, and layer, between parts of a control built from HTML primitives. | ||
449 | Auto-placement in CSS Grid Layout | CSS, CSS Grids, Guide |
In addition to the ability to place items accurately onto a created grid, the CSS Grid Layout specification contains rules that control what happens when you create a grid and do not place some or all of the child items. You can see auto-placement in action in the simplest of ways by creating a grid on a set of items. If you give the items no placement information they will position themselves on the grid, one in each grid cell. | ||
450 | Basic Concepts of grid layout | CSS, CSS Grids, Guide, Layout |
CSS Grid Layout introduces a two-dimensional grid system to CSS. Grids can be used to lay out major page areas or small user interface elements. This article introduces the CSS Grid Layout and the new terminology that is part of the CSS Grid Layout Level 1 specification. The features shown in this overview will then be explained in greater detail in the rest of this guide. | ||
451 | Box alignment in CSS Grid Layout | Alignment in Grids, Boxes, CSS, CSS Grid, Grid Alignment, Guide, alignment, box alignment |
This guide presents demonstrations of how box alignment in grid layout works. You will see many similarities in how these properties and values work in flexbox. | ||
452 | CSS Grid Layout and Accessibility | Accessibility, CSS, CSS Grids, Guide |
Those of us who have been doing web development for more years than we care to remember might consider that CSS Grid is a little bit like using “tables for layout”. Back in the early days of web design, the way we constructed page layout was to use HTML tables, then fragment our design into the cells of those tables in order to create a layout. This had some advantages over the “CSS Positioning” that came afterwards, in that we could take advantage of the alignment and full height columns offered by table display. The biggest downside however was that it tied our design to the mark-up, often creating accessibility issues as it did so. In order to lay the design out in the table we often broke up the content in ways that made no sense at all when read out by a screen reader for example. | ||
453 | CSS Grid Layout and Progressive Enhancement | CSS, CSS Grids, Design, Guide |
we now have CSS Grid Layout support in the public versions of Firefox, Chrome, Opera, Safari and Edge. However, while evergreen browsers mean that many of us are going to see the majority of users having Grid Layout support very quickly, there are also old or non-supporting browsers to contend with. In this guide we will walk through a variety of strategies for support. | ||
454 | CSS grids, logical values and writing modes | CSS, CSS Grids, Guide |
For this guide, we will look at this feature of grid and other modern layout methods, learning a little about writing modes and logical vs. physical properties as we do so. | ||
455 | Grid template areas | CSS, CSS Grids, Guide |
In the previous guide we looked at grid lines, and how to position items against those lines. When you use CSS Grid Layout you always have lines, and this can be a straightforward way to place items on your grid. However, there is an alternate method to use for positioning items on the grid which you can use alone or in combination with line-based placement. This method involves placing our items using named template areas, and we will find out exactly how this method works. You will see very quickly why we sometimes call this the ascii-art method of grid layout! | ||
456 | Layout using named grid lines | CSS, CSS Grids, Guide |
In previous guides we’ve looked at placing items by the lines created by defining grid tracks and also how to place items using named template areas. In this guide we are going to look at how these two things work together when we use named lines. Line naming is incredibly useful, but some of the more baffling looking grid syntax comes from this combination of names and track sizes. Once you work through some examples it should become clearer and easier to work with. | ||
457 | Line-based placement with CSS Grid | CSS, CSS Grids, Guide |
In the article covering the basic concepts of grid layout, we started to look at how to position items on a grid using line numbers. In this article we will fully explore how this fundamental feature of the specification works. | ||
458 | Realizing common layouts using CSS Grid Layout | CSS, CSS Grids, Guide |
To round off this set of guides to CSS Grid Layout, I am going to walk through a few different layouts, which demonstrate some of the different techniques you can use when designing with grid layout. We will look at an example using grid-template-areas, a typical 12-column flexible grid system, and also a product listing using auto-placement. As you can see from this set of examples, there is often more than one way to achieve the result you want with grid layout. Choose the method you find most helpful for the problems that you are solving and the designs that you need to implement. | ||
459 | Relationship of grid layout to other layout methods | CSS, CSS Grids, Guide |
CSS Grid Layout has been designed to work alongside other parts of CSS, as part of a complete system for doing the layout. In this guide, I will explain how a grid fits together with other techniques you may already be using. | ||
460 | CSS Images | CSS, CSS Images, Overview, Reference |
CSS Images is a module of CSS that defines what types of images can be used (the <image> type, containing URLs, gradients and other types of images), how to resize them and how they, and other replaced content, interact with the different layout models. |
||
461 | Implementing image sprites in CSS | Advanced, CSS, CSS Images, Graphics, Guide, NeedsContent, Sprites, Web |
Image sprites are used in numerous web apps where multiple images are used. Rather than include each image as a separate image file, it is much more memory- and bandwidth-friendly to send them as a single image, so the number of HTTP requests is reduced. | ||
462 | Using CSS gradients | Advanced, CSS, CSS Images, Example, Gradients, Guide, Web |
CSS gradients are represented by the <gradient> data type, a special type of <image> made of a progressive transition between two or more colors. You can choose between three types of gradients: linear (created with the linear-gradient() function), radial (created with radial-gradient() ), and conic (created with the conical-gradient function). You can also create repeating gradients with the repeating-linear-gradient() and repeating-radial-gradient() functions. |
||
463 | CSS Layout cookbook | CSS, Layout, cookbook, recipes |
The CSS layout cookbook aims to bring together recipes for common layout patterns, things you might need to implement in your own sites. In addition to providing code you can use as a starting point in your projects, these recipes highlight the different ways layout specifications can be used, and the choices you can make as a developer. | ||
464 | Breadcrumb Navigation | CSS, Layout, Navigation, cookbook, flexbox |
Breadcrumb navigation helps the user to understand their location in the website by providing a breadcrumb trail back to the start page. | ||
465 | Card | CSS, CSS Cookbook, CSS Grid, card, css layout |
This pattern is a list of "card" components with optional footers. | ||
466 | Center an element | CSS, Layout, Recipe, box alignment, centering, cookbook, flexbox |
In this recipe you will see how to center one box inside another. Centering both horizontally and vertically was difficult before flexbox, with the Box Alignment properties it is now straightforward. | ||
467 | Column layouts | CSS, Layout, Multi-col, columns, cookbook, flexbox, grid |
You will often need to create a layout which has a number of columns, and CSS provides several ways to do this. Whether you use Grid, Flexbox or Multi-column layout will depend on what you are trying to achieve, and in this recipe we explore these options. | ||
468 | Contribute a recipe | CSS, Contribute, Layout, Templates, cookbook, recipes |
If you would like to contribute an example for the Layout Cookbook, then this page explains the steps to take to have your example published. | ||
469 | Cookbook template | CSS, Contribute, Layout, Template, cookbook, recipes |
Description of the problem this recipe solves or the pattern you are demonstrating. | ||
470 | Grid wrapper | CSS, Guide, Layout, cookbook, recipes |
This pattern is useful for aligning grid content within a central wrapper, while also allowing items to break out and align to the edge of the containing element or page when desired. | ||
471 | List group with badges | CSS, Layout, box alignment, cookbook, flexbox, lists |
In this recipe we will create a list group pattern with badges that indicate a count. | ||
472 | Pagination | CSS, CSS Cookbook, css layout, flexbox, pagination |
This cookbook pattern demonstrates the navigation pattern used to display pagination, where the user can move between pages of content such as search results. | ||
473 | Recipe: Media objects | CSS, Layout, Media object, Recipe, cookbook, fit-content, float, grid |
The Media Object is a pattern we see all over the web. Named by Nicole Sullivan it refers to a two-column box with an image on one side and descriptive text on the other, e.g. a facebook post or tweet. | ||
474 | Split Navigation | CSS, Layout, Navigation, cookbook, flexbox |
A navigation pattern where one or more elements are separated from the rest of the navigation items. | ||
475 | Sticky footers | CSS, Layout, Recipe, cookbook, flexbox, grid, sticky footer |
A sticky footer pattern is one where the footer of your page "sticks" to the bottom of the viewport in cases where the content is shorter than the viewport height. We'll look at a couple of techniques for creating one in this recipe. | ||
476 | CSS Lists | CSS, CSS Lists, Overview, Reference |
CSS Lists is a module of CSS that defines how lists can be laid out and styled. | ||
477 | Consistent list indentation | CSS, Guide, NeedsUpdate |
One of the most common style changes made to lists is a change in the indentation distance—that is, how far the list items are pushed over to the right.This article will help you understand the problems that can occur and how to avoid them. | ||
478 | Using CSS counters | Advanced, CSS, CSS Counter Styles, Guide, Layout, Reference, Web |
CSS counters let you adjust the appearance of content based on its location in a document. For example, you can use counters to automatically number the headings in a webpage. Counters are, in essence, variables maintained by CSS whose values may be incremented by CSS rules to track how many times they're used. | ||
479 | CSS Logical Properties and Values | CSS, CSS Logical Properties, Landing, Overview, Reference |
CSS Logical Properties and Values is a module of CSS introducing logical properties and values that provide the ability to control layout through logical, rather than physical, direction and dimension mappings. | ||
480 | Basic concepts of Logical Properties and Values | CSS, CSS Logical Properties, Guide, concepts, writing modes |
The Logical Properties and Values Specification introduces flow-relative mappings for many of the properties and values in CSS. This article introduces the specification, and explains flow relative properties and values. | ||
481 | Logical properties for floating and positioning | CSS, CSS Logical Properties, Floating, Guide, Positioning |
The Logical Properties and Values specification contains logical mappings for the physical values of float and clear , and also for the positioning properties used with positioned layout. This guide takes a look at how to use these. |
||
482 | Logical properties for margins, borders and padding | CSS, CSS Logical Properties, Guide, concepts, writing modes |
The Logical Properties and Values specification defines flow-relative mappings for the various margin, border, and padding properties and their shorthands. In this guide we take a look at these. | ||
483 | Logical properties for sizing | CSS, CSS Logical Properties, Guide, sizing, writing modes |
In this guide we will explain the flow-relative mappings between physical dimension properties and logical properties used for sizing elements on our pages. | ||
484 | CSS Masking | CSS, CSS Masking, Overview, Reference |
CSS Masking is a CSS module that defines means, including masking and clipping, for partially or fully hiding portions of visual elements. | ||
485 | CSS Miscellaneous | CSS, Overview, Reference |
These pages contain CSS properties that are highly experimental or don't fit in any other categories. | ||
486 | CSS Multi-column Layout | CSS, CSS Multi-column Layout, Layout, Overview, Reference |
CSS Multi-column Layout is a module of CSS that adds support for multi-column layouts. Support is included for establishing the number of columns in a layout, as well as how content should flow from column to column, gap sizes between columns, and column dividing lines (known as column rules) along with their appearance. | ||
487 | Basic Concepts of Multicol | CSS, CSS Multi-column Layout, Guide, Layout |
Multiple-column Layout, usually referred to as multicol, is a specification for laying out content into a set of column boxes much like columns in a newspaper. This guide explains how the specification works with some common use case examples. | ||
488 | Handling Overflow in Multicol | CSS, CSS Multi-column Layout, Guide, Layout |
In this guide we look at how multicol deals with overflow, both inside the column boxes and in situations where there is more content than will fit into the container. | ||
489 | Handling content breaks in multicol | CSS, CSS Multi-column Layout, Guide, Layout |
Content is broken between column boxes in multiple-column layout in the same way that it is broken between pages in paged media. In both contexts we control where and how things break by using properties of the CSS Fragmentation specification. In this guide we see how Fragmentation works in multicol. | ||
490 | Spanning and Balancing Columns | CSS, CSS Multi-column Layout, Guide, Layout |
In this guide we look at how to make elements span across columns inside the multicol container and how to control how the columns are filled. | ||
491 | Styling Columns | CSS, CSS Multi-column Layout, Guide, Layout |
This details all the current ways in which column boxes can be styled. In the next guide we will take a look at making elements inside a container span across all columns. | ||
492 | Using multi-column layouts | Advanced, CSS, CSS Multi-column Layout, Guide, Layout, Web |
The CSS Multi-column Layout Module extends the block layout mode to allow the easy definition of multiple columns of text. | ||
493 | CSS Namespaces | CSS, CSS Namespaces, Overview, Reference, Web |
CSS Namespaces is a CSS module that allows authors to specify XML namespaces in CSS. | ||
494 | CSS Paged Media | CSS, CSS Paged Media, Overview, Reference |
CSS Paged Media is a module of CSS that defines how page switches are handled. | ||
495 | CSS Positioned Layout | CSS, CSS Positioning, Overview, Reference |
CSS Positioned Layout is a module of CSS that defines how to position elements on the page. | ||
496 | Understanding CSS z-index | Advanced, CSS, Guide, Reference, Understanding_CSS_z-index, z-index |
The z-index attribute lets you adjust the order of the layering of objects when rendering content. |
||
497 | Stacking context example 1 | Advanced, CSS, Understanding_CSS_z-index |
Let's start with a basic example. In the root stacking context we have two DIVs (DIV #1 and DIV #3), both relatively positioned, but without z-index properties. Inside DIV #1 there is an absolutely positioned DIV #2, while in DIV #3 there is an absolutely positioned DIV #4, both without z-index properties. | ||
498 | Stacking context example 2 | Advanced, CSS, Understanding_CSS_z-index |
This is a very simple example, but it is the key for understanding the concept of stacking context. There are the same four DIVs of the previous example, but now z-index properties are assigned on both levels of the hierarchy. | ||
499 | Stacking context example 3 | Advanced, CSS, Understanding_CSS_z-index |
This last example shows problems that arise when mixing several positioned elements in a multi-level HTML hierarchy and when z-indexes are assigned using class selectors. | ||
500 | Stacking with floated blocks | Advanced, CSS, Guide, Reference, Understanding_CSS_z-index, z-index |
For floated blocks, the stacking order is a bit different. Floating blocks are placed between non-positioned blocks and positioned blocks: | ||
501 | Stacking without the z-index property | Advanced, CSS, Guide, Reference, Understanding_CSS_z-index, z-index |
When the z-index property is not specified on any element, elements are stacked in the following order (from bottom to top): |
||
502 | The stacking context | Advanced, CSS, Guide, Reference, z-index |
The stacking context is a three-dimensional conceptualization of HTML elements along imaginary z-axis relative to the user, who is assumed to be facing the viewport or the webpage. HTML elements occupy this space in priority order based on element attributes. | ||
503 | Using z-index | Advanced, CSS, Guide, Reference, Understanding_CSS_z-index, z-index |
The first part of this article, Stacking without the z-index property, explains how stacking is arranged by default. If you want to create a custom stacking order, you can use the z-index property on a positioned element. |
||
504 | CSS Properties Reference | CSS, Style |
The following is a basic list of the most common CSS properties with the equivalent of the DOM notation which is usually accessed from JavaScript: | ||
505 | CSS Ruby Layout | CSS, CSS Ruby, Overview, Reference |
CSS Ruby Layout is a module of CSS that provides the rendering model and formatting controls related to the display of ruby annotation. Ruby annotation is a form of interlinear annotation, consisting of short runs of text alongside the base text. They are typically used in East Asian documents to indicate pronunciation or to provide a short annotation. | ||
506 | CSS Scroll Snap | CSS, CSS Scroll Snap, Overview, Reference |
CSS Scroll Snap is a module of CSS that introduces scroll snap positions, which enforce the scroll positions that a scroll container’s scrollport may end at after a scrolling operation has completed. | ||
507 | Basic concepts of CSS Scroll Snap | CSS, CSS Scroll Snap, Guide, concepts |
The CSS Scroll Snap specification gives us a way to snap scrolling to certain points as the user scrolls through a document. This can be helpful in creating a more app-like experience on mobile or even on the desktop for some types of applications. | ||
508 | Browser compatibility and Scroll Snap | CSS, CSS Scroll Snap, Guide, browser compat, compat |
Firefox initially implemented an early version of the Scroll Snap Specification, called Scroll Snap Points. In this guide we look at how to create cross-browser compatible scroll snap code during the period where some browsers support the new spec, and some the old spec. | ||
509 | CSS Scroll Snap Points | CSS, CSS Scroll Snap, Overview, Reference |
CSS Scroll Snap Points is a module of CSS that introduces scroll snap positions. These determine the specific positions that a container’s scrollport may end at after a scrolling operation has completed. | ||
510 | CSS Scrollbars | CSS, Overview, css scrollbars |
CSS Scrollbars standardizes the obsolete scrollbar color properties introduced in 2000 by Windows IE 5.5. | ||
511 | CSS Shapes | Boundaries, CSS, CSS Shapes, Overview, Reference, Shape, margin, wrapping |
CSS Shapes describe geometric shapes for use in CSS. For the Level 1 specification, CSS Shapes can be applied to floating elements. | ||
512 | Basic Shapes | CSS, CSS Shapes, Guide, Reference |
CSS Shapes can be defined using the <basic-shape> type, and in this guide I’ll explain how each of the different values accepted by this type work. They range from simple circles to complex polygons. |
||
513 | Overview of CSS Shapes | CSS, CSS Shapes, Overview, shapes |
The CSS Shapes Level 1 Specification describes geometric shapes in CSS. They are, in Level 1 of the specification, designed to be applied to floated items. This article provides an overview of what you can do with shapes. | ||
514 | Shapes From Images | CSS, CSS Shapes, Guide |
In this guide we will take a look at how we can create a shape from an image file with an alpha channel or even from a CSS Gradient. This is a very flexible way to create shapes. Rather than drawing a path with a complex polygon in CSS, you can create the shape in a graphics program and then use the path created by the pixels less opaque than a threshold value. | ||
515 | Shapes from box values | Boundaries, Boxes, CSS, CSS Shapes, Margins, border-box, border-radius, box values, content-box, float, margin-box, padding-box, shapes |
A straightforward way to create a shape is to use a value from the CSS Box Model. This article explains how to do this. | ||
516 | CSS Table | CSS, CSS Table, Overview, Reference |
CSS Table is a CSS module that defines how to lay out table data. | ||
517 | CSS Text | CSS, CSS Text, Overview |
CSS Text is a module of CSS that defines how to perform text manipulation, like line breaking, justification and alignment, white space handling, and text transformation. | ||
518 | CSS Text Decoration | CSS, CSS Text Decoration, Overview, Reference |
CSS Text Decoration is a module of CSS that defines features relating to text decoration, such as underlines, text shadows, and emphasis marks. | ||
519 | CSS Transforms | CSS, CSS Transforms, Overview, Reference |
CSS Transforms is a module of CSS that defines how elements styled with CSS can be transformed in two-dimensional or three-dimensional space. | ||
520 | Using CSS transforms | 3D, Advanced, CSS, CSS Transforms, Graphics, Guide, Rotate, Scale, Scaling, perspective, rotation |
By modifying the coordinate space, CSS transforms change the shape and position of the affected content without disrupting the normal document flow. This guide provides an introduction to using transforms. | ||
521 | CSS Transitions | CSS, CSS Transitions, Overview, Reference |
CSS Transitions is a module of CSS that lets you create gradual transitions between the values of specific CSS properties. The behavior of these transitions can be controlled by specifying their timing function, duration, and other attributes. | ||
522 | Using CSS transitions | Advanced, CSS, CSS Transitions, CSS3 Transitions, Guide |
CSS transitions provide a way to control animation speed when changing CSS properties. Instead of having property changes take effect immediately, you can cause the changes in a property to take place over a period of time. | ||
523 | CSS Tutorials | CSS, Guide, Junk, Tutorial |
Learning CSS may be a daunting task. In order to help you, we have written numerous tutorials about CSS. Some are aimed at complete beginners, while others present complex features to be used by more experienced users. | ||
524 | CSS Writing Modes | CSS, CSS Writing Modes, Overview, Reference |
CSS Writing Modes is a CSS module that defines various international writing modes, such as left-to-right (e.g. used by Latin and Indic scripts), right-to-left (e.g. used by Hebrew or Arabic scripts), bidirectional (used when mixing left-to-right and right-to-left scripts) and vertical (e.g. used by some Asian scripts). | ||
525 | CSS basic data types | CSS, CSS Data Type, Overview, Reference |
CSS basic data types define typical values (including keywords and units) accepted by CSS properties and functions. They are a special kind of component value type. | ||
526 | CSS documentation index | CSS, Index, MDN Meta |
Found 990 pages: | ||
527 | CSS reference | CSS, Overview, Reference, l10n:priority |
Use this CSS reference to browse an alphabetical index of all the standard CSS properties, pseudo-classes, pseudo-elements, data types, and at-rules. You can also browse a list of all the CSS selectors organized by type and a list of key CSS concepts. Also included is a brief DOM-CSS / CSSOM reference. | ||
528 | CSS selectors | CSS, Overview, Reference, Selectors |
CSS selectors define the elements to which a set of CSS rules apply. | ||
529 | Using the :target pseudo-class in selectors | :target, CSS, Guide, Reference, Selectors |
When a URL points at a specific piece of a document, it can be difficult for the user to notice. Find out how you can use some simple CSS to draw attention to the target of a URL and improve the user's experience. | ||
530 | CSS values and units | CSS, Reference, values and units |
There are a common set of values and units that CSS properties accept. The majority of these are defined in the CSS Values and Units specification. This document details these, with some basic information about how they are used. Refer to the page for each value type to read detailed information. | ||
531 | CSS3 | CSS, NeedsUpdate, Reference |
CSS3 is the latest evolution of the Cascading Style Sheets language and aims at extending CSS2.1. It brings a lot of long-awaited novelties, like rounded corners, shadows, gradients, transitions or animations, as well as new layouts like multi-columns, flexible box or grid layouts. | ||
532 | CSSOM View | CSS, CSSOM, CSSOM View, Layout, Overview, Reference |
CSSOM View is a module of CSS that lets you manipulate the visual view of a document, in particular its scrolling behavior. | ||
533 | Coordinate systems | CSS, CSSOM, CSSOM View, Coordinate systems, Coordinates, Guide, Layout, NeedsContent |
When specifying the location of a pixel in a graphics context (just like when specifying coordinate systems in algebra), its position is defined relative to a fixed point in the context. This fixed point is called the origin. The position is specified as the number of pixels offset from the origin along each dimension of the context. | ||
534 | Child combinator | CSS, Reference, Selectors |
The child combinator (> ) is placed between two CSS selectors. It matches only those elements matched by the second selector that are the children of elements matched by the first. |
||
535 | Class selectors | CSS, Reference, Selectors |
The CSS class selector matches elements based on the contents of their class attribute. |
||
536 | Column combinator | CSS, Draft, Reference, Selectors, Tables |
The column combinator (|| ) is placed between two CSS selectors. It matches only those elements matched by the second selector that belong to the column elements matched by the first. |
||
537 | Comments | CSS, Reference |
A CSS comment is used to add explanatory notes to the code or to prevent the browser from interpreting specific parts of the style sheet. By design, comments have no effect on the layout of a document. | ||
538 | Compositing and Blending | CSS, Compositing and Blending, Overview, Reference |
Compositing and Blending is a CSS module that defines how shapes of different elements are combined into a single image. | ||
539 | Computed value | CSS, Reference |
The computed value of a CSS property is the value that is transferred from parent to child during inheritance. | ||
540 | Custom properties (--*): CSS variables | CSS, CSS Custom Properties, Reference |
Property names that are prefixed with -- , like --example-name , represent custom properties that contain a value that can be used in other declarations using the var() function. |
||
541 | Descendant combinator | CSS, Reference, Selectors |
The descendant combinator — typically represented by a single space ( ) character — combines two selectors such that elements matched by the second selector are selected if they have an ancestor element matching the first selector. Selectors that utilize a descendant combinator are called descendant selectors. |
||
542 | Draft Implementations of CSS Features | CSS, Junk, Reference |
Mozilla supports a number of extensions to CSS that are prefixed with -moz- . The following list contains all Mozilla extensions that are implementations of features that are being standardized by the W3C. Proprietary features are omitted. |
||
543 | Filter Effects | CSS, Filter Effects, Overview, Reference |
Filter Effects is a module of CSS that defines a way of processing an element’s rendering before it is displayed in the document. | ||
544 | General sibling combinator | CSS, Reference, Selectors |
The general sibling combinator (~ ) separates two selectors and matches the second element only if it follows the first element (though not necessarily immediately), and both are children of the same parent element. |
||
545 | ID selectors | CSS, Reference, Selectors |
The CSS ID selector matches an element based on the value of its id attribute. In order for the element to be selected, its ID attribute must match exactly the value given in the selector. |
||
546 | Inheritance | CSS, Guide, Inheritance, Layout, Web |
In CSS, inheritance controls what happens when no value is specified for a property on an element. Refer to any CSS property definition to see whether a specific property inherits by default ("Inherited: yes") or not ("Inherited: no"). | ||
547 | Initial value | CSS, Reference |
The initial value of a CSS property is its default value, as listed in its definition table. | ||
548 | Introducing the CSS Cascade | CSS, Cascade, Guide, Introduction, Layout, Reference, Style, Style sheet, Stylesheets |
This article explains what the cascade is, the order in which CSS declarations cascade, and how this affects you, the web developer. | ||
549 | Layout and the containing block | CSS, CSS Position, Containers, Guide, Layout, Position, Style, blocks, containing block, size |
In this article, we examine the factors that an element's containing block. | ||
550 | Layout mode | CSS, Layout, Reference |
A CSS layout mode, sometimes simply called layout, is an algorithm that determines the position and size of boxes based on the way they interact with their sibling and ancestor boxes. There are several of them: | ||
551 | List of Proprietary CSS Features | CSS, Junk |
This list includes proprietary extensions to CSS in different browser engines which are not experimental implementations of features being standardized (see Draft Implementations of CSS Features for a list of these). | ||
552 | Media queries | CSS, CSS3 Media Queries, Media Queries, Overview, Reference, Responsive Design |
Media queries let you adapt your site or app depending on the presence or value of various device characteristics and parameters. | ||
553 | Testing media queries programmatically | Advanced, CSS, DOM, Guide, JavaScript, Media Queries, MediaQueryList, Responsive Design, Web, matchMedia |
The DOM provides features that can test the results of a media query programmatically, via the MediaQueryList interface and its methods and properties. Once you've created a MediaQueryList object, you can check the result of the query or receive notifications when the result changes. |
||
554 | Using Media Queries for Accessibility | @media, Accessibility, Animation, CSS, media feature |
Media Queries can also be used to help users with disabilities understand your website better. | ||
555 | Using media queries | Advanced, CSS, Guide, Media, Media Queries, Responsive Design, Web |
Media queries are useful when you want to modify your site or app depending on a device's general type (such as print vs. screen) or specific characteristics and parameters (such as screen resolution or browser viewport width). | ||
556 | Microsoft CSS extensions | CSS, CSS:Microsoft Extensions, Non-standard, Overview, Reference |
Microsoft applications such as Edge and Internet Explorer support a number of special Microsoft extensions to CSS. These extensions are prefixed with -ms- . |
||
557 | Motion Path | CSS, Experimental, Motion Path, Overview, Reference |
Motion Path is a CSS module that allows authors to animate any graphical object along a custom path. | ||
558 | Mozilla CSS extensions | CSS, CSS:Mozilla Extensions, Non-standard, Overview, Reference |
Mozilla applications such as Firefox support a number of special Mozilla extensions to CSS, including properties, values, pseudo-elements and pseudo-classes, at-rules, and media queries. | ||
559 | Mozilla CSS support chart | CSS, Junk, Reference |
This page lists supported CSS selectors, properties, @-rules, Media queries and values in alphabetical order. | ||
560 | Paged media | CSS, Page Breaks, Reference |
Paged media properties control the presentation of content for print or any other media that splits content into discrete pages. It allows you to set page breaks, control printable area, style left and right pages differently, and control breaks inside elements. Widely supported properties include: | ||
561 | Privacy and the :visited selector | CSS, Guide, Pseudo-class, Reference, Security, Selectors |
Before about 2010, the CSS :visited selector allowed websites to uncover a user's browsing history and figure out what sites the user had visited. This was done through window.getComputedStyle and other techniques. This process was quick to execute, and made it possible not only to determine where the user had been on the web, but could also be used to guess a lot of information about the user's identity. |
||
562 | Pseudo-classes | CSS, Overview, Pseudo-class, Reference, Selectors |
A CSS pseudo-class is a keyword added to a selector that specifies a special state of the selected element(s). | ||
563 | Pseudo-elements | CSS, Overview, Pseudo-element, Reference, Selectors |
A CSS pseudo-element is a keyword added to a selector that lets you style a specific part of the selected element(s). For example, ::first-line can be used to change the font of the first line of a paragraph. |
||
564 | Questions about CSS | Beginner, CSS, Draft, Junk, NeedsContent, NeedsHelp |
Cascading Style Sheets (CSS) is a rule-based language allowing developers to define styles to apply to HTML elements (or other markup structures). | ||
565 | Replaced element | CSS, Layout, Reference, css layout, rendering, replaced element |
In CSS, a replaced element is an element whose representation is outside the scope of CSS; they're external objects whose representation is independent of the CSS formatting model. | ||
566 | Resolved value | CSS, Reference |
The resolved value of a CSS property is the value returned by getComputedStyle() . |
||
567 | Scaling of SVG backgrounds | CSS, CSS Background, Guide, Images, Reference, SVG |
Given the flexibility of SVG images, there's a lot to keep in mind when using them as background images with the background-image property, and even more to keep in mind when also scaling them using the background-size property. This article describes how scaling of SVG images is handled when using these properties. |
||
568 | Shorthand properties | CSS, Guide, Layout, Reference, Shorthand Properties, properties, shorthand |
Shorthand properties are CSS properties that let you set the values of multiple other CSS properties simultaneously. Using a shorthand property, you can write more concise (and often more readable) style sheets, saving time and energy. | ||
569 | Specificity | CSS, Example, Guide, Reference, Web |
Specificity is the means by which browsers decide which CSS property values are the most relevant to an element and, therefore, will be applied. Specificity is based on the matching rules which are composed of different sorts of CSS selectors. | ||
570 | Specified value | CSS, Reference |
The specified value of a CSS property is the value it receives from the document's style sheet. | ||
571 | Syntax | CSS, Guide, Reference, Web |
The basic goal of the Cascading Stylesheet (CSS) language is to allow a browser engine to paint elements of the page with specific features, like colors, positioning, or decorations. The CSS syntax reflects this goal and its basic building blocks are: | ||
572 | Tools | CSS, NeedsUpdate |
CSS offers a number of powerful features that can be tricky to use, or have a number of parameters, so that it's helpful to be able to visualize them while you work on them. This page offers links to a number of useful tools that will help you build the CSS to style your content using these features. | ||
573 | Cubic Bezier Generator | CSS, Tools |
This is a sample tool; it lets you edit Bezier curves. This is not really yet a useful tool, but will be! | ||
574 | Linear-gradient Generator | CSS, Tools |
This tool can be used to create custom CSS3 linear-gradient() backgrounds. |
||
575 | Type selectors | CSS, HTML, Node, Reference, Selectors |
The CSS type selector matches elements by node name. In other words, it selects all elements of the given type within a document. | ||
576 | Universal selectors | CSS, Reference, Selectors |
The CSS universal selector (* ) matches elements of any type. |
||
577 | Used value | CSS, Reference |
The used value of a CSS property is its value after all calculations have been performed on the computed value. | ||
578 | Using CSS custom properties (variables) | CSS, CSS Variables, Guide, Web |
CSS variables are entities defined by CSS authors that contain specific values to be reused throughout a document. They are set using custom property notation (e.g., --main-color: black; ) and are accessed using the var() function (e.g., color: var(--main-color); ). |
||
579 | Value definition syntax | CSS, Reference, Syntax |
No summary! | ||
580 | Viewport concepts | Best practices, CSS, Guide, Mobile, Resource, layout viewport, viewport, virtual viewport |
This article explains the concept of the viewport, differentiating between the visual viewport and the layout viewport, and understanding what viewport means and its impact in terms of CSS, SVG, and mobile devices. | ||
581 | Visual formatting model | CSS, CSS Box Model, NeedsUpdate, Reference |
The CSS visual formatting model is an algorithm that processes a document and displays it on visual media. This model is a basic concept of CSS. | ||
582 | WebKit CSS extensions | CSS, CSS:WebKit Extensions, Non-standard, Overview, Reference |
Applications based on WebKit or Blink, such as Safari and Chrome, support a number of special WebKit extensions to CSS. These extensions are generally prefixed with -webkit- . Most -webkit- prefixed properties also work with an -apple- prefix. A few are prefixed with -epub- . |
||
583 | align-content | CSS, CSS Box Alignment, CSS Property, Reference |
The CSS align-content property sets how the browser distributes space between and around content items along the cross-axis of a flexbox container, and the main-axis of a grid container. |
||
584 | align-items | CSS, CSS Flexible Boxes, CSS Property, Reference |
The CSS align-items property sets the align-self value on all direct children as a group. The align-self property sets the alignment of an item within its containing block. In Flexbox it controls the alignment of items on the Cross Axis, in Grid Layout it controls the alignment of items on the Block Axis within their grid area. |
||
585 | align-self | CSS, CSS Box Alignment, CSS Flexible Boxes, CSS Property, Reference |
The align-self CSS property aligns flex items of the current flex line overriding the align-items value. If any of the item's cross-axis margin is set to auto , then align-self is ignored. In Grid layout align-self aligns the item inside the grid area. |
||
586 | all | CSS, CSS Cascade, CSS Property, Reference |
The all CSS shorthand property sets all of an element's properties (other than unicode-bidi and direction ) to their initial or inherited values, or to the values specified in another stylesheet origin. |
||
587 | animation | CSS, CSS Animations, CSS Property, Reference |
The animation shorthand CSS property sets an animated transition between styles. |
||
588 | animation-delay | CSS, CSS Animations, CSS Property, Reference |
The animation-delay CSS property sets when an animation starts. The animation can start later, immediately from its beginning, or immediately and partway through the animation. |
||
589 | animation-direction | CSS, CSS Animations, CSS Property, Reference |
The animation-direction CSS property sets whether an animation should play forwards, backwards, or alternating back and forth. |
||
590 | animation-duration | CSS, CSS Animations, CSS Property, Reference |
The animation-duration CSS property sets the length of time that an animation takes to complete one cycle. |
||
591 | animation-fill-mode | CSS, CSS Animations, CSS Property, Reference |
The animation-fill-mode CSS property sets how a CSS animation applies styles to its target before and after its execution. |
||
592 | animation-iteration-count | CSS, CSS Animations, CSS Property, CSS Property Animations |
The animation-iteration-count CSS property sets the number of times an animation cycle should be played before stopping. |
||
593 | animation-name | CSS, CSS Animations, CSS Property, Reference |
The animation-name CSS property sets one or more animations to apply to an element. Each name is an @keyframes at-rule that sets the property values for the animation sequence. |
||
594 | animation-play-state | CSS, CSS Animations, CSS Property, Reference |
The animation-play-state CSS property sets whether an animation is running or paused. |
||
595 | animation-timing-function | CSS, CSS Animations, CSS Property, Reference |
The animation-timing-function CSS property sets how an animation progresses through the duration of each cycle. |
||
596 | appearance (-moz-appearance, -webkit-appearance) | -moz-appearance, -webkit-appearance, CSS, CSS Property, Experimental, Reference, appearance |
The -moz-appearance CSS property is used in Gecko (Firefox) to display an element using platform-native styling based on the operating system's theme. |
||
597 | attr() | CSS, CSS Function, Layout, Reference, Web, attr |
The attr() CSS function is used to retrieve the value of an attribute of the selected element and use it in the style sheet. It can also be used on pseudo-elements, in which case the value of the attribute on the pseudo-element's originating element is returned. |
||
598 | azimuth | CSS, CSS Property, Deprecated, NeedsUpdate, Reference |
In combination with elevation , the azimuth CSS property enables different audio sources to be positioned spatially for aural presentation. This is important in that it provides a natural way to tell several voices apart, as each can be positioned to originate at a different location on the sound stage. Stereo output produce a lateral sound stage, while binaural headphones and multi-speaker setups allow for a fully three-dimensional stage. |
||
599 | backdrop-filter | CSS, CSS Property, Graphics, Layout, NeedsContent, Reference, SVG, SVG Filter, Web |
The backdrop-filter CSS property lets you apply graphical effects such as blurring or color shifting to the area behind an element. Because it applies to everything behind the element, to see the effect you must make the element or its background at least partially transparent. |
||
600 | backface-visibility | CSS, CSS Property, CSS Transforms, Experimental, Reference |
The backface-visibility CSS property sets whether the back face of an element is visible when turned towards the user. |
||
601 | background | CSS, CSS Background, CSS Property, Reference |
The background shorthand CSS property sets all background style properties at once, such as color, image, origin and size, or repeat method. |
||
602 | background-attachment | CSS, CSS Background, CSS Property, Reference |
The background-attachment CSS property sets whether a background image's position is fixed within the viewport, or scrolls with its containing block. |
||
603 | background-blend-mode | CSS, CSS Property, Compositing and Blending |
The background-blend-mode CSS property sets how an element's background images should blend with each other and with the element's background color. |
||
604 | background-clip | CSS, CSS Background, CSS Property, Reference |
The background-clip CSS property sets whether an element's background <color> or <image> extends underneath its border. |
||
605 | background-color | CSS, CSS Background, CSS Property, Graphics, HTML Colors, HTML Styles, Layout, Reference, Styles, Styling HTML, background-color |
The background-color CSS property sets the background color of an element. |
||
606 | background-image | CSS, CSS Background, CSS Property, Reference |
The background-image CSS property sets one or more background images on an element. |
||
607 | background-origin | CSS, CSS Background, CSS Property, Reference |
The background-origin CSS property sets the background positioning area. In other words, it sets the origin position of an image set with the background-image property. |
||
608 | background-position | CSS, CSS Background, CSS Property, Reference |
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 . |
||
609 | background-position-x | CSS, CSS Background, CSS Property, Experimental, Reference |
The background-position-x CSS property sets the initial horizontal position for each background image. The position is relative to the position layer set by background-origin . |
||
610 | background-position-y | CSS, CSS Background, CSS Property, Experimental, Reference |
The background-position-y CSS property sets the initial vertical position, relative to the background position layer defined by background-origin , for each defined background image. |
||
611 | background-repeat | CSS, CSS Background, CSS Property, Reference |
The background-repeat CSS property sets how background images are repeated. A background image can be repeated along the horizontal and vertical axes, or not repeated at all. |
||
612 | background-size | CSS, CSS Background, CSS Property, Reference |
The background-size CSS property sets the size of the element's background image. The image can be left to its natural size, stretched, or constrained to fit the available space. |
||
613 | block-size | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The block-size CSS property defines the horizontal or vertical size of an element's block, depending on its writing mode. It corresponds to either the width or the height property, depending on the value of writing-mode . |
||
614 | border | CSS, CSS Borders, CSS Property, Layout, Reference |
The border CSS property sets an element's border. It's a shorthand for border-width , border-style , and border-color . |
||
615 | border-block | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
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. |
||
616 | border-block-color | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-block-color CSS property defines the color of the logical block borders of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color and border-bottom-color , or border-right-color and border-left-color property depending on the values defined for writing-mode , direction , and text-orientation . |
||
617 | border-block-end | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
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. |
||
618 | border-block-end-color | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-block-end-color CSS property defines the color of the logical block-end border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color , border-right-color , border-bottom-color , or border-left-color property depending on the values defined for writing-mode , direction , and text-orientation . |
||
619 | border-block-end-style | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-block-end-style CSS property defines the style of the logical block end border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style , border-right-style , border-bottom-style , or border-left-style property depending on the values defined for writing-mode , direction , and text-orientation . |
||
620 | border-block-end-width | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-block-end-width CSS property defines the width of the logical block-end border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width , border-right-width , border-bottom-width , or border-left-width property depending on the values defined for writing-mode , direction , and text-orientation . |
||
621 | border-block-start | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
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. |
||
622 | border-block-start-color | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-block-start-color CSS property defines the color of the logical block-start border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color , border-right-color , border-bottom-color , or border-left-color property depending on the values defined for writing-mode , direction , and text-orientation . |
||
623 | border-block-start-style | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-block-start-style CSS property defines the style of the logical block start border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style , border-right-style , border-bottom-style , or border-left-style property depending on the values defined for writing-mode , direction , and text-orientation . |
||
624 | border-block-start-width | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-block-start-width CSS property defines the width of the logical block-start border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width , border-right-width , border-bottom-width , or border-left-width property depending on the values defined for writing-mode , direction , and text-orientation . |
||
625 | border-block-style | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-block-style CSS property defines the style of the logical block borders of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style and border-bottom-style , or border-left-style and border-right-style properties depending on the values defined for writing-mode , direction , and text-orientation . |
||
626 | border-block-width | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-block-width CSS property defines the width of the logical block borders of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width and border-bottom-width , or border-left-width , and border-right-width property depending on the values defined for writing-mode , direction , and text-orientation . |
||
627 | border-bottom | CSS, CSS Borders, CSS Property, Reference |
The border-bottom CSS property is a shorthand that sets the values of border-bottom-width , border-bottom-style and border-bottom-color . |
||
628 | border-bottom-color | CSS, CSS Borders, CSS Property, Reference |
The border-bottom-color CSS property sets the color of an element's bottom border. It can also be set with the shorthand CSS properties border-color or border-bottom . |
||
629 | border-bottom-left-radius | CSS, CSS Borders, CSS Property, Reference |
The border-bottom-left-radius CSS property rounds the bottom-left corner of an element. |
||
630 | border-bottom-right-radius | CSS, CSS Borders, CSS Property, Reference |
The border-bottom-right-radius CSS property rounds the bottom-right corner of an element. |
||
631 | border-bottom-style | CSS, CSS Borders, CSS Property, Reference |
The border-bottom-style CSS property sets the line style of an element's bottom border . |
||
632 | border-bottom-width | CSS, CSS Borders, CSS Property, Reference |
The border-bottom-width CSS property sets the width of the bottom border of a box. |
||
633 | border-collapse | CSS, CSS Borders, CSS Property, CSS Tables, Reference |
The border-collapse CSS property sets whether cells inside a <table> have shared or separate borders. |
||
634 | border-color | CSS, CSS Borders, CSS Property, CSS Styles, HTML Colors, Reference, Styling HTML, border-color, borders, colors |
The border-color shorthand CSS property sets the color of all sides of an element's border. |
||
635 | border-end-end-radius | CSS, CSS Logical Property, CSS Property, Experimental, Reference, border-end-end-radius, writing modes |
The border-end-end-radius CSS property defines a logical border radius on an element, which maps to a physical border radius that depends on on the element's writing-mode , direction , and text-orientation . |
||
636 | border-end-start-radius | CSS, CSS Logical Property, CSS Property, Experimental, Reference, border-end-start-radius, writing modes |
The border-end-start-radius CSS property defines a logical border radius on an element, which maps to a physical border radius depending on the element's writing-mode , direction , and text-orientation . |
||
637 | border-image | CSS, CSS Borders, CSS Property, Reference |
The border-image CSS property draws an image in place of an element's border-style . |
||
638 | border-image-outset | CSS, CSS Borders, CSS Property, Reference |
The border-image-outset CSS property sets the distance by which an element's border image is set out from its border box. |
||
639 | border-image-repeat | CSS, CSS Borders, CSS Property, Reference |
The border-image-repeat CSS property defines how the edge regions of a source image are adjusted to fit the dimensions of an element's border image. |
||
640 | border-image-slice | CSS, CSS Borders, CSS Property, NeedsExample, Reference |
The border-image-slice CSS property divides the image specified by border-image-source into regions. These regions form the components of an element's border image. |
||
641 | border-image-source | CSS, CSS Borders, CSS Property, Reference |
The border-image-source CSS property sets the source image used to create an element's border image. |
||
642 | border-image-width | CSS, CSS Borders, CSS Property, Reference |
The border-image-width CSS property sets the width of an element's border image. |
||
643 | border-inline | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
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. |
||
644 | border-inline-color | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-inline-color CSS property defines the color of the logical inline borders of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color and border-bottom-color , or border-right-color and border-left-color property depending on the values defined for writing-mode , direction , and text-orientation . |
||
645 | border-inline-end | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
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. |
||
646 | border-inline-end-color | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-inline-end-color CSS property defines the color of the logical inline-end border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color , border-right-color , border-bottom-color , or border-left-color property depending on the values defined for writing-mode , direction , and text-orientation . |
||
647 | border-inline-end-style | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-inline-end-style CSS property defines the style of the logical inline end border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style , border-right-style , border-bottom-style , or border-left-style property depending on the values defined for writing-mode , direction , and text-orientation . |
||
648 | border-inline-end-width | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-inline-end-width CSS property defines the width of the logical inline-end border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width , border-right-width , border-bottom-width , or border-left-width property depending on the values defined for writing-mode , direction , and text-orientation . |
||
649 | border-inline-start | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
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. |
||
650 | border-inline-start-color | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-inline-start-color CSS property defines the color of the logical inline start border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color , border-right-color , border-bottom-color , or border-left-color property depending on the values defined for writing-mode , direction , and text-orientation . |
||
651 | border-inline-start-style | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-inline-start-style CSS property defines the style of the logical inline start border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style , border-right-style , border-bottom-style , or border-left-style property depending on the values defined for writing-mode , direction , and text-orientation . |
||
652 | border-inline-start-width | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-inline-start-width CSS property defines the width of the logical inline-start border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width , border-right-width , border-bottom-width , or border-left-width property depending on the values defined for writing-mode , direction , and text-orientation . |
||
653 | border-inline-style | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-inline-style CSS property defines the style of the logical inline borders of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style and border-bottom-style , or border-left-style and border-right-style properties depending on the values defined for writing-mode , direction , and text-orientation . |
||
654 | border-inline-width | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The border-inline-width CSS property defines the width of the logical inline borders of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width and border-bottom-width , or border-left-width , and border-right-width property depending on the values defined for writing-mode , direction , and text-orientation . |
||
655 | border-left | CSS, CSS Borders, CSS Property, Reference |
The border-left CSS property is a shorthand that sets the values of border-left-width , border-left-style and border-left-color . |
||
656 | border-left-color | CSS, CSS Borders, CSS Property, Reference |
The border-left-color CSS property sets the color of an element's left border. It can also be set with the shorthand CSS properties border-color or border-left . |
||
657 | border-left-style | CSS, CSS Borders, CSS Property, Reference |
The border-left-style CSS property sets the line style of an element's left border . |
||
658 | border-left-width | CSS, CSS Borders, CSS Property, Reference |
The border-left-width CSS property sets the width of the left border of an element. |
||
659 | border-radius | CSS, CSS Borders, CSS Property, Reference |
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. |
||
660 | border-right | CSS, CSS Borders, CSS Property, Reference |
The border-right CSS property is a shorthand that sets the values of border-right-width , border-right-style and border-right-color . |
||
661 | border-right-color | CSS, CSS Borders, CSS Property, Reference |
The border-right-color CSS property sets the color of an element's right border. It can also be set with the shorthand CSS properties border-color or border-right . |
||
662 | border-right-style | CSS, CSS Borders, CSS Property, Reference |
The border-right-style CSS property sets the line style of an element's right border . |
||
663 | border-right-width | CSS, CSS Borders, CSS Property, Reference |
The border-right-width CSS property sets the width of the right border of an element. |
||
664 | border-spacing | CSS, CSS Property, CSS Tables, Reference |
The border-spacing CSS property sets the distance between the borders of adjacent <table> cells. This property applies only when border-collapse is separate . |
||
665 | border-start-end-radius | CSS, CSS Logical Property, CSS Property, Experimental, Reference, border-start-end-radius, writing modes |
The border-start-end-radius CSS property defines a logical border radius on an element, which maps to a physical border radius depending on the element's writing-mode , direction , and text-orientation . |
||
666 | border-start-start-radius | CSS, CSS Logical Property, CSS Property, Experimental, Reference, border-start-start-radius, writing modes |
The border-start-start-radius CSS property defines a logical border radius on an element, which maps to a physical border radius that depends on the element's writing-mode , direction , and text-orientation . |
||
667 | border-style | CSS, CSS Borders, CSS Property, Reference |
The border-style CSS property is a shorthand property that sets the line style for all four sides of an element's border. |
||
668 | border-top | CSS, CSS Borders, CSS Property, Reference |
The border-top CSS property is a shorthand that sets the values of border-top-width , border-top-style and border-top-color . |
||
669 | border-top-color | CSS, CSS Borders, CSS Property, Reference |
The border-top-color CSS property sets the color of an element's top border. It can also be set with the shorthand CSS properties border-color or border-top . |
||
670 | border-top-left-radius | CSS, CSS Borders, CSS Property, Reference |
The border-top-left-radius CSS property rounds the top-left corner of an element. |
||
671 | border-top-right-radius | CSS, CSS Borders, CSS Property, Reference |
The border-top-right-radius CSS property rounds the top-right corner of an element. |
||
672 | border-top-style | CSS, CSS Borders, CSS Property, Reference |
The border-top-style CSS property sets the line style of an element's top border . |
||
673 | border-top-width | CSS, CSS Borders, CSS Property, Reference |
The border-top-width CSS property sets the width of the top border of an element. |
||
674 | border-width | CSS, CSS Borders, CSS Property, Reference |
The border-width shorthand CSS property sets the widths of all four sides of an element's border. |
||
675 | bottom | CSS, CSS Positioning, CSS Property, Reference |
The bottom CSS property participates in specifying the vertical position of a positioned element. It has no effect on non-positioned elements. |
||
676 | box-align | CSS, CSS Property, NeedsUpdate, Non-standard, Reference |
The box-align CSS property specifies how an element aligns its contents across its layout in a perpendicular direction. The effect of the property is only visible if there is extra space in the box. |
||
677 | box-decoration-break | CSS, CSS Fragmentation, CSS Property, Experimental, Reference |
The box-decoration-break CSS property specifies how an element's fragments should be rendered when broken across multiple lines, columns, or pages. |
||
678 | box-direction | CSS, Non-standard, Reference |
The box-direction CSS property specifies whether a box lays out its contents normally (from the top or left edge), or in reverse (from the bottom or right edge). |
||
679 | box-flex | CSS, CSS Property, Non-standard, Reference, box-flex |
The -moz-box-flex and -webkit-box-flex CSS properties specify how a -moz-box or -webkit-box grows to fill the box that contains it, in the direction of the containing box's layout. |
||
680 | box-flex-group | CSS, CSS Property, Non-standard, Reference |
The box-flex-group CSS property assigns the flexbox's child elements to a flex group. |
||
681 | box-lines | CSS, CSS Property, Non-standard, Reference |
The box-lines CSS property determines whether the box may have a single or multiple lines (rows for horizontally oriented boxes, columns for vertically oriented boxes). |
||
682 | box-ordinal-group | CSS, CSS Property, Non-standard, Reference |
The box-ordinal-group CSS property assigns the flexbox's child elements to an ordinal group. |
||
683 | box-orient | CSS, Non-standard, Reference |
The box-orient CSS property specifies whether an element lays out its contents horizontally or vertically. |
||
684 | box-pack | CSS, CSS Property, Non-standard, Reference, box-pack |
The -moz-box-pack and -webkit-box-pack CSS properties specify how a -moz-box or -webkit-box packs its contents in the direction of its layout. The effect of this is only visible if there is extra space in the box. |
||
685 | box-shadow | CSS, CSS Backgrounds and Borders, CSS Property, CSS Styles, HTML Colors, Reference, Shadows, Styles, Styling HTML, box-shadow |
The box-shadow CSS property adds shadow effects around an element's frame. You can set multiple effects separated by commas. |
||
686 | box-sizing | CSS, CSS Property, Reference |
The box-sizing CSS property defines how the user agent should calculate the total width and height of an element. |
||
687 | break-after | CSS, CSS Fragmentation, CSS Multi-column Layout, CSS Property, NeedsExample, Reference |
The break-after CSS property defines how page, column, or region breaks should behave after a generated box. If there is no generated box, the property is ignored. |
||
688 | break-before | CSS, CSS Fragmentation, CSS Multi-column Layout, CSS Property, NeedsExample, Reference |
The break-before CSS property sets how page, column, or region breaks should behave before a generated box. If there is no generated box, the property is ignored. |
||
689 | break-inside | CSS, CSS Fragmentation, CSS Multi-column Layout, CSS Property, NeedsExample, Reference |
The break-inside CSS property defines how page, column, or region breaks should behave inside a generated box. If there is no generated box, the property is ignored. |
||
690 | calc() | CSS, CSS Function, Calculate, Compute, Function, Layout, Reference, Web, calc |
The calc() CSS function lets you perform calculations when specifying CSS property values. It can be used anywhere a <length> , <frequency> , <angle> , <time> , <percentage> , <number> , or <integer> is allowed. |
||
691 | caption-side | CSS, CSS Property, CSS Tables, Reference |
The caption-side CSS property puts the content of a table's <caption> on the specified side. The values are relative to the writing-mode of the table. |
||
692 | caret-color | CSS, CSS Property, CSS User Interace, Editing, HTML Colors, Input, Reference, Styling HTML, Text Editing, caret, caret-color, contenteditable |
The caret-color CSS property sets the color of the insertion caret, the visible marker where the next character typed will be inserted. |
||
693 | clamp() | CSS, CSS Function, Calculate, Compute, Function, Layout, Reference, Web, clamp |
The clamp() CSS function clamps a value between an upper and lower bound. clamp() enables selecting a middle value within a range of values between a definited minimum and maximum. It takes three parameters: a minimum value, a preferred value, and a maximum allowed value. The clamp() function can be used anywhere a <length> , <frequency> , <angle> , <time> , <percentage> , <number> , or <integer> is allowed. |
||
694 | clear | CSS, CSS Positioning, CSS Property, Reference |
The clear CSS property sets whether an element must be moved below (cleared) floating elements that precede it. The clear property applies to floating and non-floating elements. |
||
695 | clip | CSS, CSS Masking, CSS Property, Deprecated, Reference |
The clip CSS property defines what portion of an element is visible. The clip property applies only to absolutely positioned elements, that is elements with position:absolute or position:fixed . |
||
696 | clip-path | CSS, CSS Masking, CSS Property, Experimental, Reference, Web |
The clip-path CSS property creates a clipping region that sets what part of an element should be shown. Parts that are inside the region are shown, while those outside are hidden. |
||
697 | color | CSS, CSS Colors, CSS Property, CSS Text, HTML Colors, HTML Styles, Layout, Reference, Styling HTML, Styling text, Web, color |
The color CSS property sets the foreground color value of an element's text and text decorations, and sets the currentcolor value. |
||
698 | color-adjust | Adjusting Colors, CSS, CSS Colors, CSS Property, HTML Colors, HTML Styles, Layout, Non-standard, Reference, Styling HTML, Styling text, Web, color-adjust |
The color-adjust CSS property sets what, if anything, the user agent may do to optimize the appearance of the element on the output device. |
||
699 | column-count | CSS, CSS Multi-column Layout, CSS Property, Reference |
The column-count CSS property breaks an element's content into the specified number of columns. |
||
700 | column-fill | CSS, CSS Multi-column Layout, CSS Property, Reference |
The column-fill CSS property controls how an element's contents are balanced when broken into columns. |
||
701 | column-gap (grid-column-gap) | CSS, CSS Flexible Boxes, CSS Grid, CSS Multi-column Layout, CSS Property, Reference, column-gap |
The column-gap CSS property sets the size of the gap (gutter) between an element's columns. |
||
702 | column-rule | CSS, CSS Multi-column Layout, CSS Property, Reference |
The column-rule CSS property sets the width, style, and color of the rule (line) drawn between columns in a multi-column layout. |
||
703 | column-rule-color | CSS, CSS Multi-column Layout, CSS Property, HTML Colors, Reference, Styles, Styling HTML, column-rule-color, columns |
The column-rule-color CSS property sets the color of the rule (line) drawn between columns in a multi-column layout. |
||
704 | column-rule-style | CSS, CSS Multi-column Layout, CSS Property, Reference |
The column-rule-style CSS property sets the style of the line drawn between columns in a multi-column layout. |
||
705 | column-rule-width | CSS, CSS Multi-column Layout, CSS Property, Reference |
The column-rule-width CSS property sets the width of the rule (line) drawn between columns in a multi-column layout. |
||
706 | column-span | CSS, CSS Multi-column Layout, CSS Property, Reference |
The column-span CSS property makes it possible for an element to span across all columns when its value is set to all . |
||
707 | column-width | CSS, CSS Multi-column Layout, CSS Property, Reference |
The column-width CSS property specifies the ideal column width in a multi-column layout. |
||
708 | columns | CSS, CSS Multi-column Layout, CSS Property, Reference |
The columns CSS property sets the column width and column count of an element. |
||
709 | conic-gradient() | CSS, CSS Function, CSS Images, Graphics, Layout, Reference, Web, gradient |
The conic-gradient() CSS function creates an image consisting of a radial gradient with color transitions around a center point rather than radiating from the center. Example conical gradients include pie charts and color wheels. The result of the conic-gradient() function is an object of the <gradient> data type, which is a special kind of <image> . |
||
710 | contain | CSS, CSS Containment, CSS Property, Experimental, Layout, NeedsExample, Paint, Reference, Style, Web |
The contain CSS property allows an author to indicate that an element and its contents are, as much as possible, independent of the rest of the document tree. This allows the browser to recalculate layout, style, paint, size, or any combination of them for a limited area of the DOM and not the entire page. |
||
711 | content | CSS, CSS Property, Generated Content, Reference |
The content CSS property replaces an element with a generated value. Objects inserted using the content property are anonymous replaced elements. |
||
712 | counter-increment | CSS, CSS Lists, CSS Property, Reference |
The counter-increment CSS property increases or decreases the value of a CSS counter by a given value. |
||
713 | counter-reset | CSS, CSS Lists, CSS Property, Reference |
The counter-reset CSS property resets a CSS counter to a given value. |
||
714 | cross-fade() | CSS, CSS Function, CSS-4 Images, Experimental, Reference, Web |
The CSS cross-fade() function can be used to blend two or more images at a defined transparency. |
||
715 | cursor | CSS, CSS Property, Cursor, Reference |
The cursor CSS property sets mouse cursor to display when the mouse pointer is over an element. |
||
716 | dimension | CSS, CSS Data Type, Reference, dimension, unit, value |
The <dimension> CSS data type represents a <number> with a unit attached to it, for example 10px. |
||
717 | direction | BiDi, CSS, CSS Property, Reference |
The direction CSS property sets the direction of text, table columns, and horizontal overflow. |
||
718 | display | CSS, CSS Display, CSS Property, Reference, display |
The display CSS property defines the display type of an element, which consists of the two basic qualities of how an element generates boxes — the outer display type defining how the box participates in flow layout, and the inner display type defining how the children of the box are laid out. |
||
719 | element() | CSS, CSS Function, CSS4-images, Layout, Reference, Web |
The element() CSS function defines an <image> value generated from an arbitrary HTML element. This image is live, meaning that if the HTML element is changed, the CSS properties using the resulting value are automatically updated. |
||
720 | empty-cells | CSS, CSS Property, CSS Tables, Reference |
The empty-cells CSS property sets whether borders and backgrounds appear around <table> cells that have no visible content. |
||
721 | env() | CSS, CSS Function, CSS Variables, Draft, Reference, Variables, env, env() |
The env() CSS function can be used to insert the value of a user agent-defined environment variable into your CSS, in a similar fashion to the var() function and custom properties. The difference is that, as well as being user-agent defined rather than user-defined, environment variables are globally scoped to a document, whereas custom properties are scoped to the element(s) on which they are declared. |
||
722 | filter | CSS, CSS Property, Reference, SVG, SVG Filter, filter |
The filter CSS property applies graphical effects like blur or color shift to an element. Filters are commonly used to adjust the rendering of images, backgrounds, and borders. |
||
723 | fit-content() | CSS, CSS Function, CSS Grid, Experimental, Layout, Reference, Web |
The fit-content() CSS function clamps a given size to an available size according to the formula min(maximum size, max(minimum size, argument)) . |
||
724 | flex | CSS, CSS Flexible Boxes, CSS Property, Reference |
The flex CSS property sets how a flex item will grow or shrink to fit the space available in its flex container. It is a shorthand for flex-grow , flex-shrink , and flex-basis . |
||
725 | flex-basis | CSS, CSS Flexible Boxes, CSS Property, Reference |
The flex-basis CSS property sets the initial main size of a flex item. It sets the size of the content box unless otherwise set with box-sizing . |
||
726 | flex-direction | CSS, CSS Flexible Boxes, CSS Property, Reference |
The flex-direction CSS property sets how flex items are placed in the flex container defining the main axis and the direction (normal or reversed). |
||
727 | flex-flow | CSS, CSS Flexible Boxes, CSS Property, Reference |
The flex-flow CSS property is a shorthand property for flex-direction and flex-wrap properties. |
||
728 | flex-grow | CSS, CSS Flexible Boxes, CSS Property, NeedsContent, Reference |
The flex-grow CSS property sets how much of the available space in the flex container should be assigned to that item (the flex grow factor). |
||
729 | flex-shrink | CSS, CSS Flexible Boxes, CSS Property, NeedsContent, Reference |
The flex-shrink CSS property sets the flex shrink factor of a flex item. If the size of flex items is larger than the flex container, items shrink to fit according to flex-shrink . |
||
730 | flex-wrap | CSS, CSS Flexible Boxes, CSS Property, Reference |
The flex-wrap CSS property sets whether flex items are forced onto one line or can wrap onto multiple lines. If wrapping is allowed, it sets the direction that lines are stacked. |
||
731 | float | CSS, CSS Positioning, CSS Property, Reference |
The float CSS property places an element on the left or right side of its container, allowing text and inline elements to wrap around it. |
||
732 | font | CSS, CSS Fonts, CSS Property, Reference |
The font CSS property is a shorthand for font-style , font-variant , font-weight , font-size , line-height , and font-family . Alternatively, it sets an element's font to a system font. |
||
733 | font-family | CSS, CSS Fonts, CSS Property, Reference |
The font-family CSS property specifies a prioritized list of one or more font family names and/or generic family names for the selected element. |
||
734 | font-feature-settings | CSS, CSS Fonts, CSS Property, Reference |
The font-feature-settings CSS property controls advanced typographic features in OpenType fonts. |
||
735 | font-kerning | CSS, CSS Fonts, CSS Property, Reference |
The font-kerning CSS property sets the use of the kerning information stored in a font. |
||
736 | font-language-override | CSS, CSS Fonts, CSS Property, Reference |
The font-language-override CSS property controls the use of language-specific glyphs in a typeface. |
||
737 | font-optical-sizing | CSS, CSS Fonts, CSS Property, NeedsExample, Reference |
The font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes. |
||
738 | font-size | CSS, CSS Fonts, CSS Property, Reference |
The font-size CSS property sets the size of the font. |
||
739 | font-size-adjust | CSS, CSS Fonts, CSS Property, Reference |
The font-size-adjust CSS property sets how the font size should be chosen based on the height of lowercase rather than capital letters. |
||
740 | font-smooth | CSS, CSS Property, Non-standard, Reference |
The font-smooth CSS property controls the application of anti-aliasing when fonts are rendered. |
||
741 | font-stretch | CSS, CSS Fonts, CSS Property, Reference |
The font-stretch CSS property selects a normal, condensed, or expanded face from a font. |
||
742 | font-style | CSS, CSS Fonts, CSS Property, Reference, Web, font |
The font-style CSS property sets whether a font should be styled with a normal, italic, or oblique face from its font-family . |
||
743 | font-synthesis | CSS, CSS Fonts, CSS Property, Reference |
The font-synthesis CSS property controls which missing typefaces, bold or italic, may be synthesized by the browser. |
||
744 | font-variant | CSS, CSS Fonts, CSS Property, Reference |
The font-variant CSS property is a shorthand for the longhand properties font-variant-caps , font-variant-numeric , font-variant-alternates , font-variant-ligatures , and font-variant-east-asian . You can also set the CSS Level 2 (Revision 1) values of font-variant , (that is, normal or small-caps ), by using the font shorthand. |
||
745 | font-variant-alternates | CSS, CSS Fonts, CSS Property, Reference |
The font-variant-alternates CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in @font-feature-values . |
||
746 | font-variant-caps | CSS, CSS Fonts, CSS Property, Reference |
The font-variant-caps CSS property controls the use of alternate glyphs for capital letters. |
||
747 | font-variant-east-asian | CSS, CSS Fonts, CSS Property, NeedsLiveSample, Reference |
The font-variant-east-asian CSS property controls the use of alternate glyphs for East Asian scripts, like Japanese and Chinese. |
||
748 | font-variant-ligatures | CSS, CSS Fonts, CSS Property, Reference |
The font-variant-ligatures CSS property controls which ligatures and contextual forms are used in textual content of the elements it applies to. This leads to more harmonized forms in the resulting text. |
||
749 | font-variant-numeric | CSS, CSS Fonts, CSS Property, Reference |
The font-variant-numeric CSS property controls the usage of alternate glyphs for numbers, fractions, and ordinal markers. |
||
750 | font-variant-position | CSS, CSS Fonts, CSS Property, Reference |
The font-variant-position CSS property controls the use of alternate, smaller glyphs that are positioned as superscript or subscript. |
||
751 | font-variation-settings | CSS, CSS Fonts, CSS Property, Reference |
The font-variation-settings CSS property provides low-level control over variable font characteristics, by specifying the four letter axis names of the characteristics you want to vary, along with their values. |
||
752 | font-weight | CSS, CSS Fonts, CSS Property, Reference |
The font-weight CSS property specifies the weight (or boldness) of the font. The font weights available to you will depend on the font-family you are using. Some fonts are only available in normal and bold . |
||
753 | gap (grid-gap) | CSS, CSS Flexible Boxes, CSS Grid, CSS Multi-column Layout, CSS Property, Reference, gap |
The gap CSS property sets the gaps (gutters) between rows and columns. It is a shorthand for row-gap and column-gap . |
||
754 | grid | CSS, CSS Grid, CSS Property, Reference |
The grid CSS property is a shorthand property that sets all of the explicit grid properties (grid-template-rows , grid-template-columns , and grid-template-areas ), and all the implicit grid properties (grid-auto-rows , grid-auto-columns , and grid-auto-flow ), in a single declaration. |
||
755 | grid-area | CSS, CSS Grid, CSS Property, Reference |
The grid-area CSS property is a shorthand property for grid-row-start , grid-column-start , grid-row-end and grid-column-end , specifying a grid item’s size and location within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the edges of its grid area. |
||
756 | grid-auto-columns | CSS, CSS Grid, CSS Property, Experimental, Reference |
The grid-auto-columns CSS property specifies the size of an implicitly-created grid column track. |
||
757 | grid-auto-flow | CSS, CSS Grid, CSS Property, Reference |
The grid-auto-flow CSS property controls how the auto-placement algorithm works, specifying exactly how auto-placed items get flowed into the grid. |
||
758 | grid-auto-rows | CSS, CSS Grid, CSS Property, Reference |
The grid-auto-rows CSS property specifies the size of an implicitly-created grid row track. |
||
759 | grid-column | CSS, CSS Grid, CSS Property, Reference |
The grid-column CSS property is a shorthand property for grid-column-start and grid-column-end specifying a grid item's size and location within the 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. |
||
760 | grid-column-end | CSS, CSS Grid, CSS Property, Reference |
The grid-column-end CSS property specifies a grid item’s end position within the grid column by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the block-end edge of its grid area. |
||
761 | grid-column-start | CSS, CSS Grid, CSS Property, Reference |
The grid-column-start CSS property specifies a grid item’s start position within the grid column by contributing a line, a span, or nothing (automatic) to its grid placement. This start position defines the block-start edge of the grid area. |
||
762 | grid-row | CSS, CSS Grid, CSS Property, Reference |
The grid-row CSS property is a shorthand property for grid-row-start and grid-row-end specifying a grid item’s size and location within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start and inline-end edge of its grid area. |
||
763 | grid-row-end | CSS, CSS Grid, CSS Property, Reference |
The grid-row-end CSS property specifies a grid item’s end position within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-end edge of its grid area. |
||
764 | grid-row-start | CSS, CSS Grid, CSS Property, Reference |
The grid-row-start CSS property specifies a grid item’s start position within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start edge of its grid area. |
||
765 | grid-template | CSS, CSS Grid, CSS Property, Reference |
The grid-template CSS property is a shorthand property for defining grid columns, rows, and areas. |
||
766 | grid-template-areas | CSS, CSS Grid, CSS Property, Reference |
The grid-template-areas CSS property specifies named grid areas. |
||
767 | grid-template-columns | CSS, CSS Grid, CSS Property, Reference |
The grid-template-columns CSS property defines the line names and track sizing functions of the grid columns. |
||
768 | grid-template-rows | CSS, CSS Grid, CSS Property, Reference |
The grid-template-rows CSS property defines the line names and track sizing functions of the grid rows. |
||
769 | hanging-punctuation | CSS, CSS Property, CSS Text, Experimental, Reference |
The hanging-punctuation CSS property specifies whether a punctuation mark should hang at the start or end of a line of text. |
||
770 | height | CSS, CSS Property, Reference |
The height CSS property specifies the height of an element. By default, the property defines the height of the content area. If box-sizing is set to border-box , however, it instead determines the height of the border area. |
||
771 | hyphens | CSS, CSS Property, CSS Text, Reference |
The hyphens CSS property specifies how words should be hyphenated when text wraps across multiple lines. You can prevent hyphenation entirely, use hyphenation in manually-specified points within the text, or let the browser automatically insert hyphens where appropriate. |
||
772 | image() | CSS, CSS Function, CSS Images, NeedsExample, Reference, Web |
The image() CSS function defines an <image> in a similar fashion to the <url> function, but with added functionality including specifying the image's directionality, specifying a preferred image with fallback images in case where the preferred image is not supported, displaying just a part of that image defined by a media fragment, and specifying a solid color as the image as a fallback in case none of the specified images are able to be rendered. |
||
773 | image-orientation | CSS, CSS Images, CSS Property, EXIF, Experimental, Image Correction, Image Orientation, Orientation, Reference, image-orientation |
The image-orientation CSS property specifies a layout-independent correction to the orientation of an image. |
||
774 | image-rendering | CSS, CSS Images, CSS Property, Experimental, Reference, image-rendering |
The image-rendering CSS property sets an image scaling algorithm. The property applies to an element itself, to any images set in its other properties, and to its descendants. |
||
775 | image-set() | CSS, CSS Function, CSS-4 Images, Reference, Web |
The image-set() CSS function notation is a method of letting the browser pick the most appropriate CSS image from a given set, primarily for high pixel density screens. |
||
776 | ime-mode | CSS, CSS Property, Deprecated |
The ime-mode CSS property controls the state of the input method editor (IME) for text fields. This property is obsolete. |
||
777 | inherit | CSS, CSS Cascade, CSS Value, Cascade, Inheritance, Layout, Reference, Style, inherit |
The inherit CSS keyword causes the element for which it is specified to take the computed value of the property from its parent element. |
||
778 | initial | CSS, CSS Cascade, CSS Value, Default state, Initial state, Layout, Reference, initial |
The initial CSS keyword applies the initial (or default) value of a property to an element. The inital value should not be confused with the value specified by the browser's style sheet. It can be applied to any CSS property. |
||
779 | initial-letter | CSS, CSS Inline, CSS Property, Experimental, Graphics, Layout, Reference, Web |
The initial-letter CSS property sets styling for dropped, raised, and sunken initial letters. |
||
780 | initial-letter-align | CSS, CSS Inline, CSS Property, Experimental, Graphics, Layout, NeedsLiveSample, Reference, Web |
The initial-letter-align CSS property specifies the alignment of initial letters within a paragraph. |
||
781 | inline-size | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The inline-size CSS property defines the horizontal or vertical size of an element's block, depending on its writing mode. It corresponds to either the width or the height property, depending on the value of writing-mode . |
||
782 | inset | CSS, CSS Logical Property, CSS Property, Experimental, Property, Reference |
The inset CSS property defines the logical block and inline start and end offsets of an element, which map 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 . |
||
783 | inset-block | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
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 . |
||
784 | inset-block-end | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The inset-block-end CSS property defines the logical block end offset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation. |
||
785 | inset-block-start | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The inset-block-start CSS property defines the logical block start offset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation. |
||
786 | inset-inline | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The inset-inline 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 . |
||
787 | inset-inline-end | CSS, CSS Logical Property, CSS Property, Experimental, NeedsContent, Reference |
The inset-inline-end CSS property defines the logical inline end inset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation. |
||
788 | inset-inline-start | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The inset-inline-start CSS property defines the logical inline start inset of an element, which maps to a physical offset depending on the element's writing mode, directionality, and text orientation. |
||
789 | isolation | CSS, CSS Property, Compositing and Blending |
The isolation CSS property determines whether an element must create a new stacking context. |
||
790 | justify-content | CSS, CSS Box Alignment, CSS Property, Reference |
The CSS justify-content property defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container. |
||
791 | justify-items | CSS, CSS Box Alignment, CSS Property, Reference |
The CSS justify-items property defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis. |
||
792 | justify-self | CSS, CSS Box Alignment, CSS Property, Reference |
The CSS justify-self property set the way a box is justified inside its alignment container along the appropriate axis. |
||
793 | left | CSS, CSS Positioning, CSS Property, Reference |
The left CSS property participates in specifying the horizontal position of a positioned element. It has no effect on non-positioned elements. |
||
794 | letter-spacing | CSS, CSS Property, CSS Text, Reference, SVG |
The letter-spacing CSS property sets the spacing behavior between text characters. |
||
795 | line-break | CSS, CSS Property, CSS Text, NeedsExample, Reference |
The line-break CSS property sets how to break lines of Chinese, Japanese, or Korean (CJK) text when working with punctuation and symbols. |
||
796 | line-height | CSS, CSS Fonts, CSS Property, Reference |
The line-height CSS property sets the amount of space used for lines, such as in text. On block-level elements, it specifies the minimum height of line boxes within the element. On non-replaced inline elements, it specifies the height that is used to calculate line box height. |
||
797 | line-height-step | CSS, CSS Fonts, CSS Property, Reference |
The line-height-step CSS property sets the step unit for line box heights. When the property is set, line box heights are rounded up to the closest multiple of the unit. |
||
798 | linear-gradient() | CSS, CSS Function, CSS Images, Graphics, Layout, Reference, Web, gradient |
The linear-gradient() CSS function creates an image consisting of a progressive transition between two or more colors along a straight line. Its result is an object of the <gradient> data type, which is a special kind of <image> . |
||
799 | list-style | CSS, CSS Lists, CSS Property, Reference |
The list-style CSS property is a shorthand to set list style properties list-style-type , list-style-image , and list-style-position . |
||
800 | list-style-image | CSS, CSS Lists, CSS Property, Reference |
The list-style-image CSS property sets an image to be used as the list item marker. |
||
801 | list-style-position | CSS, CSS Lists, CSS Property, Reference |
The list-style-position CSS property sets the position of the ::marker relative to a list item. |
||
802 | list-style-type | CSS, CSS Lists, CSS Property, Reference |
The list-style-type CSS property sets the marker (such as a disc, character, or custom counter style) of a list item element. |
||
803 | margin | CSS, CSS Property, Reference |
The margin CSS property sets the margin area on all four sides of an element. It is a shorthand for margin-top , margin-right , margin-bottom , and margin-left . |
||
804 | margin-block | CSS, CSS Logical Property, CSS Property, Experimental, Reference, margin-block |
The margin-block CSS 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. |
||
805 | margin-block-end | CSS, CSS Logical Property, CSS Property, Experimental, NeedsContent, Reference |
The margin-block-end CSS property defines the logical block end margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation. |
||
806 | margin-block-start | CSS, CSS Logical Property, CSS Property, Experimental, NeedsContent, Reference |
The margin-block-start CSS property defines the logical block start margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation. |
||
807 | margin-bottom | CSS, CSS Property, Reference |
The margin-bottom CSS property sets the margin area on the bottom of an element. A positive value places it farther from its neighbors, while a negative value places it closer. |
||
808 | margin-inline | CSS, CSS Logical Property, CSS Property, Experimental, Reference, margin-inline |
The margin-inline CSS property defines 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. |
||
809 | margin-inline-end | CSS, CSS Logical Property, CSS Property, Experimental, NeedsContent, Reference |
The margin-inline-end CSS property defines the logical inline end margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation. In other words, it corresponds to the margin-top , margin-right , margin-bottom or margin-left property depending on the values defined for writing-mode , direction , and text-orientation . |
||
810 | margin-inline-start | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The margin-inline-start CSS property defines the logical inline start margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation. It corresponds to the margin-top , margin-right , margin-bottom , or margin-left property depending on the values defined for writing-mode , direction , and text-orientation . |
||
811 | margin-left | CSS, CSS Property, Layout, Reference |
The margin-left CSS property sets the margin area on the left side of an element. A positive value places it farther from its neighbors, while a negative value places it closer. |
||
812 | margin-right | CSS, CSS Property, Reference |
The margin-right CSS property sets the margin area on the right side of an element. A positive value places it farther from its neighbors, while a negative value places it closer. |
||
813 | margin-top | CSS, CSS Property, Reference |
The margin-top CSS property sets the margin area on the top of an element. A positive value places it farther from its neighbors, while a negative value places it closer. |
||
814 | margin-trim | CSS, CSS Property, Draft, Experimental, NeedsContent, NeedsExample, NeedsLiveSample, Reference |
The margin-trim property allows the container to trim the margins of its children where they adjoin the container’s edges. |
||
815 | mask | CSS, CSS Masking, CSS Property, Layout, Reference, SVG, Web |
The mask CSS property hides an element (partially or fully) by masking or clipping the image at specific points. |
||
816 | mask-border | CSS, CSS Masking, CSS Property, Experimental, NeedsCompatTable, Reference |
The mask-border CSS property lets you create a mask along the edge of an element's border. |
||
817 | mask-border-mode | CSS, CSS Masking, CSS Property, Experimental, NeedsCompatTable, NeedsContent, NeedsExample, Reference |
The mask-border-mode CSS property specifies the blending mode used in a mask border. |
||
818 | mask-border-outset | CSS, CSS Masking, CSS Property, Experimental, NeedsCompatTable, NeedsExample, Reference |
The mask-border-outset CSS property specifies the distance by which an element's mask border is set out from its border box. |
||
819 | mask-border-repeat | CSS, CSS Masking, CSS Property, Experimental, NeedsCompatTable, NeedsExample, Reference |
The mask-border-repeat CSS property sets how the edge regions of a source image are adjusted to fit the dimensions of an element's mask border. |
||
820 | mask-border-slice | CSS, CSS Masking, CSS Property, Experimental, NeedsCompatTable, NeedsExample, Reference |
The mask-border-slice CSS property divides the image set by mask-border-source into regions. These regions are used to form the components of an element's mask border. |
||
821 | mask-border-source | CSS, CSS Masking, CSS Property, Experimental, NeedsCompatTable, NeedsExample, Reference |
The mask-border-source CSS property sets the source image used to create an element's mask border. |
||
822 | mask-border-width | CSS, CSS Masking, CSS Property, Experimental, NeedsCompatTable, NeedsExample, Reference |
The mask-border-width CSS property sets the width of an element's mask border. |
||
823 | mask-clip | CSS, CSS Masking, CSS Property, Experimental, Reference |
The mask-clip CSS property determines the area, which is affected by a mask. The painted content of an element must be restricted to this area. |
||
824 | mask-composite | CSS, CSS Masking, CSS Property, Experimental, Reference |
The mask-composite CSS property represents a compositing operation used on the current mask layer with the mask layers below it. |
||
825 | mask-image | CSS, CSS Masking, CSS Property, Experimental, Reference |
The mask-image CSS property sets the image that is used as mask layer for an element. |
||
826 | mask-mode | CSS, CSS Masking, CSS Property, Experimental, Reference |
The mask-mode CSS property sets whether the mask reference defined by mask-image is treated as a luminance or alpha mask. |
||
827 | mask-origin | CSS, CSS Masking, CSS Property, Experimental, Reference |
The mask-origin CSS property sets the origin of a mask. |
||
828 | mask-position | CSS, CSS Masking, CSS Property, Experimental, Reference |
The mask-position CSS property sets the initial position, relative to the mask position layer set by mask-origin , for each defined mask image. |
||
829 | mask-repeat | CSS, CSS Masking, CSS Property, Experimental, Reference |
The mask-repeat CSS property sets how mask images are repeated. A mask image can be repeated along the horizontal axis, the vertical axis, both axes, or not repeated at all. |
||
830 | mask-size | CSS, CSS Masking, CSS Property, Experimental, Reference |
The mask-size CSS property specifies the sizes of the mask images. The size of the image can be fully or partially constrained in order to preserve its intrinsic ratio. |
||
831 | mask-type | CSS, CSS Masking, CSS Property, Reference, SVG |
The mask-type CSS property sets whether an SVG <mask> element is used as a luminance or an alpha mask. It applies to the <mask> element itself. |
||
832 | max() | CSS, CSS Function, Calculate, Compute, Function, Layout, Reference, Web, max |
The max () CSS function lets you set the largest (most positive) value from a list of comma-separated expressions as the value of a CSS property value. The max() function can be used anywhere a <length> , <frequency> , <angle> , <time> , <percentage> ,<number> , or <integer> is allowed. |
||
833 | max-block-size | CSS, CSS Logical Property, CSS Property, Experimental, Layout, Maximum Height, Maximum Width, Reference, height, max-block-size, size, width |
The max-block-size CSS property specifies the maximum size of an element in the direction opposite that of the writing direction as specified by writing-mode . |
||
834 | max-height | CSS, CSS Property, Reference |
The max-height CSS property sets the maximum height of an element. It prevents the used value of the height property from becoming larger than the value specified for max-height . |
||
835 | max-inline-size | CSS, CSS Logical Properties, CSS Logical Property, CSS Property, Element size, Experimental, Reference, Text Direction, Writing Mode, max-inline-size |
The max-inline-size CSS property defines the horizontal or vertical maximum size of an element's block depending on its writing mode. It corresponds to the max-width or the max-height property depending on the value defined for writing-mode . If the writing mode is vertically oriented, the value of max-inline-size relates to the maximal height of the element, otherwise it relates to the maximal width of the element. It relates to max-block-size , which defines the other dimension of the element. |
||
836 | max-width | CSS, CSS Property, Reference |
The max-width CSS property sets the maximum width of an element. It prevents the used value of the width property from becoming larger than the value specified by max-width . |
||
837 | min() | CSS, CSS Function, Calculate, Compute, Function, Layout, Reference, min |
The min() CSS function lets you set the smallest (most negative) value from a list of comma-separated expressions as the value of a CSS property value. The min() function can be used anywhere a <length> , <frequency> , <angle> , <time> , <percentage> ,<number> , or <integer> is allowed. |
||
838 | min-block-size | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The min-block-size CSS property defines the minimum horizontal or vertical size of an element's block, depending on its writing mode. It corresponds to either the min-width or the min-height property, depending on the value of writing-mode . |
||
839 | min-height | CSS, CSS Property, Reference |
The min-height CSS property sets the minimum height of an element. It prevents the used value of the height property from becoming smaller than the value specified for min-height . |
||
840 | min-inline-size | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The min-inline-size CSS property defines the horizontal or vertical minimal size of an element's block, depending on its writing mode. It corresponds to either the min-width or the min-height property, depending on the value of writing-mode . |
||
841 | min-width | CSS, CSS Property, Reference |
The min-width CSS property sets the minimum width of an element. It prevents the used value of the width property from becoming smaller than the value specified for min-width . |
||
842 | minmax() | CSS, CSS Function, CSS Grid, Experimental, Layout, Reference, Web |
The minmax () CSS function defines a size range greater than or equal to min and less than or equal to max. It is used with CSS Grids. |
||
843 | mix-blend-mode | CSS, CSS Property, Compositing and Blending |
The mix-blend-mode CSS property sets how an element's content should blend with the content of the element's parent and the element's background. |
||
844 | object-fit | CSS, CSS Images, CSS Property, Layout, Reference, css layout, object-fit, size |
The object-fit CSS property sets how the content of a replaced element, such as an <img> or <video> , should be resized to fit its container. |
||
845 | object-position | CSS, CSS Images, CSS Property, Layout, Position, Reference, Replaced Elements, css layout, object-position |
The object-position CSS property specifies the alignment of the selected replaced element's contents within the element's box. |
||
846 | offset | CSS, CSS Motion, CSS Property, Draft, Experimental, NeedsContent, Non-standard, Reference |
The offset CSS property is a shorthand property for animating an element along a defined path. |
||
847 | offset-distance | CSS, CSS Property, Draft, NeedsContent, NeedsLiveSample, Reference, motion-offset, offset-distance |
The offset-distance CSS property specifies a position along an offset-path . |
||
848 | offset-path | CSS, Reference, motion-path, offset-path |
The offset-path CSS property specifies a motion path for an element to follow and defines the element's positioning within the parent container or SVG coordinate system. |
||
849 | offset-rotate | CSS, CSS Property, Draft, NeedsContent, NeedsLiveSample, Reference, offset-rotate |
The offset-rotate CSS property defines the direction of the element while positioning along the offset path. |
||
850 | opacity | CSS, CSS Property, Reference |
The opacity CSS property sets the opacity of an element. Opacity is the degree to which content behind an element is hidden, and is the opposite of transparency. |
||
851 | order | CSS, CSS Flexible Boxes, CSS Property, Reference |
The order CSS property sets the order to lay out an item in a flex or grid container. Items in a container are sorted by ascending order value and then by their source code order. |
||
852 | orphans | CSS, CSS Fragmentation, CSS Multi-column Layout, CSS Property, Reference |
The orphans CSS property sets the minimum number of lines in a block container that must be shown at the bottom of a page, region, or column. |
||
853 | outline | CSS, CSS Outline, CSS Property, Layout, Reference |
The outline CSS property is a shorthand to set various outline properties in a single declaration: outline-style , outline-width , and outline-color . |
||
854 | outline-color | CSS, CSS Outline, CSS Property, CSS User Interace, HTML Colors, HTML Styles, Outline, Reference, Styles, Styling HTML, outline-color |
The outline-color CSS property sets the color of an element's outline. |
||
855 | outline-offset | CSS, CSS Outline, CSS Property, Reference |
The outline-offset CSS property sets the amount of space between an outline and the edge or border of an element. |
||
856 | outline-style | CSS, CSS Outline, CSS Property, Reference |
The outline-style CSS property sets the style of an element's outline. An outline is a line that is drawn around an element, outside the border . |
||
857 | outline-width | CSS, CSS Outline, CSS Property, Layout, Reference |
The outline-width CSS property sets the thickness of an element's outline. An outline is a line that is drawn around an element, outside the border . |
||
858 | overflow | CSS, CSS Box Model, CSS Property, Layout, Reference, overflow |
The overflow CSS property sets what to do when an element's content is too big to fit in its block formatting context. It is a shorthand for overflow-x and overflow-y . |
||
859 | overflow-anchor | CSS |
The overflow-anchor CSS property provides a way to opt out browser scroll anchoring behavior which adjusts scroll position to minimize content shifts. |
||
860 | overflow-wrap | CSS, CSS Property, CSS Text, Reference |
The overflow-wrap CSS property sets whether the browser should insert line breaks within words to prevent text from overflowing its content box. |
||
861 | overflow-x | CSS, CSS Box Model, CSS Property, Reference |
The overflow-x CSS property sets what shows when content overflows a block-level element's left and right edges. This may be nothing, a scroll bar, or the overflow content. |
||
862 | overflow-y | CSS, CSS Box Model, CSS Property, Reference |
The overflow-y CSS property sets what shows when content overflows a block-level element's top and bottom edges. This may be nothing, a scroll bar, or the overflow content. |
||
863 | overscroll-behavior | CSS, CSS Box Model, CSS Property, Non-standard, Reference, overscroll-behavior |
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 . |
||
864 | overscroll-behavior-x | CSS, CSS Box Model, CSS Property, Non-standard, Reference, overscroll-behavior-x |
The overscroll-behavior-x CSS property sets the browser's behavior when the horizontal boundary of a scrolling area is reached. |
||
865 | overscroll-behavior-y | CSS, CSS Box Model, CSS Property, Non-standard, Reference, overscroll-behavior-y |
The overscroll-behavior-y CSS property sets the browser's behavior when the vertical boundary of a scrolling area is reached. |
||
866 | padding | CSS, CSS Padding, CSS Property, Reference |
The padding CSS property sets the padding area on all four sides of an element. It is a shorthand for padding-top , padding-right , padding-bottom , and padding-left . |
||
867 | padding-block | CSS |
The padding-block CSS 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. |
||
868 | padding-block-end | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The padding-block-end CSS property defines the logical block end padding of an element, which maps to a physical padding depending on the element's writing mode, directionality, and text orientation. It corresponds to the padding-top , padding-right , padding-bottom , or padding-left property depending on the values defined for writing-mode , direction , and text-orientation . |
||
869 | padding-block-start | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The padding-block-start CSS property defines the logical block start padding of an element, which maps to a physical padding depending on the element's writing mode, directionality, and text orientation. It corresponds to the padding-top , padding-right , padding-bottom , or padding-left property depending on the values defined for writing-mode , direction , and text-orientation . |
||
870 | padding-bottom | CSS, CSS Padding, CSS Property, Reference |
The padding-bottom CSS property sets the height of the padding area on the bottom of an element. |
||
871 | padding-inline | CSS |
The padding-inline CSS 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. |
||
872 | padding-inline-end | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The padding-inline-end CSS property defines the logical inline end padding of an element, which maps to a physical padding depending on the element's writing mode, directionality, and text orientation. It corresponds to the padding-top , padding-right , padding-bottom , or padding-left property depending on the values defined for writing-mode , direction , and text-orientation . |
||
873 | padding-inline-start | CSS, CSS Logical Property, CSS Property, Experimental, Reference |
The padding-inline-start CSS property defines the logical inline start padding of an element, which maps to a physical padding depending on the element's writing mode, directionality, and text orientation. It corresponds to the padding-top , padding-right , padding-bottom , or padding-left property depending on the values defined for writing-mode , direction , and text-orientation . |
||
874 | padding-left | CSS, CSS Padding, CSS Property, Reference |
The padding-left CSS property sets the width of the padding area on the top of an element. |
||
875 | padding-right | CSS, CSS Padding, CSS Property, Reference |
The padding-right CSS property sets the width of the padding area on the right of an element. |
||
876 | padding-top | CSS, CSS Padding, CSS Property, Reference |
The padding-top CSS property sets the height of the padding area on the top of an element. |
||
877 | page-break-after | CSS, CSS Property, Page Breaks, Reference |
The page-break-after CSS property adjusts page breaks after the current element. |
||
878 | page-break-before | CSS, CSS Property, Page Breaks, Reference |
The page-break-before CSS property adjusts page breaks before the current element. |
||
879 | page-break-inside | CSS, CSS Property, Page Breaks, Reference |
The page-break-inside CSS property adjusts page breaks inside the current element. |
||
880 | paint-order | CSS, Experimental, Reference, SVG, Web, paint-order |
The paint-order CSS property lets you control the order in which the fill and stroke (and painting markers) of text content and shapes are drawn. |
||
881 | perspective | 3D, CSS, CSS Property, CSS Transforms, Distance, Graphics, Property, Reference, perspective |
The perspective CSS property determines the distance between the z=0 plane and the user in order to give a 3D-positioned element some perspective. |
||
882 | perspective-origin | 3D, CSS, CSS Property, CSS Transforms, Graphics, Property, Reference, Transforms, perspective, perspective-origin |
The perspective-origin CSS property determines the position at which the viewer is looking. It is used as the vanishing point by the perspective property. |
||
883 | place-content | CSS, CSS Box Alignment, CSS Property, Reference, place-content |
The place-content CSS property is a shorthand for align-content and justify-content . It can be used in any layout method which utilizes both of these alignment values. |
||
884 | place-items | CSS, CSS Flexible Boxes, CSS Grid, CSS Property, Reference |
The CSS place-items shorthand property sets the align-items and justify-items properties, respectively. If the second value is not set, the first value is also used for it. |
||
885 | place-self | CSS, CSS Box Alignment, CSS Property, Reference |
The place-self CSS property is a shorthand property sets both the align-self and justify-self properties. The first value is the align-self property value, the second the justify-self one. If the second value is not present, the first value is also used for it. |
||
886 | pointer-events | CSS, CSS Property, Reference, SVG, pointer-events |
The pointer-events CSS property sets under what circumstances (if any) a particular graphic element can become the target of pointer events. |
||
887 | position | CSS, CSS Positioning, CSS Property, Reference |
The position CSS property sets how an element is positioned in a document. The top , right , bottom , and left properties determine the final location of positioned elements. |
||
888 | quotes | CSS, CSS Property, Generated Content, Layout, Reference, Web |
The quotes CSS property sets how quotation marks appear. |
||
889 | radial-gradient() | CSS, CSS Function, CSS Images, Graphics, Layout, Reference, Web, gradient |
The radial-gradient() CSS function creates an image consisting of a progressive transition between two or more colors that radiate from an origin. Its shape may be a circle or an ellipse. The function's result is an object of the <gradient> data type, which is a special kind of <image> . |
||
890 | repeat() | CSS, CSS Function, CSS Grid, Layout, Reference, Web |
The repeat() CSS function represents a repeated fragment of the track list, allowing a large number of columns or rows that exhibit a recurring pattern to be written in a more compact form. |
||
891 | repeating-linear-gradient() | CSS, CSS Function, CSS Images, Gradients, Graphics, Layout, Reference, Web |
The repeating-linear-gradient() CSS function creates an image consisting of repeating linear gradients. It is similar to linear-gradient() and takes the same arguments, but it repeats the color stops infinitely in all directions so as to cover its entire container. The function's result is an object of the <gradient> data type, which is a special kind of <image> . |
||
892 | repeating-radial-gradient() | CSS, CSS Function, CSS Images, Gradients, Graphics, Layout, Reference, Web |
The repeating-radial-gradient() CSS function creates an image consisting of repeating gradients that radiate from an origin. It is similar to radial-gradient() and takes the same arguments, but it repeats the color stops infinitely in all directions so as to cover its entire container, similar to repeating-linear-gradient() . The function's result is an object of the <gradient> data type, which is a special kind of <image> . |
||
893 | resize | Basic User Interface, CSS, CSS Property, Reference |
The resize CSS property sets whether an element is resizable, and if so, in which directions. |
||
894 | revert | CSS, CSS Cascade, CSS Value, Layout, Reference |
The revert CSS keyword rolls back the cascade so that a property takes on the value it would have had if there were no styles in the current style origin (author, user, or user-agent). |
||
895 | right | CSS, CSS Positioning, CSS Property, Layout, Reference, Web |
The right CSS property participates in specifying the horizontal position of a positioned element. It has no effect on non-positioned elements. |
||
896 | rotate | CSS, CSS Property, Reference, Rotate, Transforms, angle, rotation |
The rotate CSS property allows you to specify rotation transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform property. |
||
897 | row-gap (grid-row-gap) | CSS, CSS Flexible Boxes, CSS Grid, CSS Property, Reference, row-gap |
The row-gap CSS property sets the size of the gap (gutter) between an element's grid rows. |
||
898 | ruby-align | CSS, CSS Property, CSS Ruby, Reference |
The ruby-align CSS property defines the distribution of the different ruby elements over the base. |
||
899 | ruby-position | CSS, CSS Property, CSS Ruby, Reference |
The ruby-position CSS property defines the position of a ruby element relatives to its base element. It can be position over the element (over ), under it (under ), or between the characters, on their right side (inter-character ). |
||
900 | scale | CSS, CSS Property, Reference, Transforms |
The scale CSS property allows you to specify scale transforms individually and independantly of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform value. |
||
901 | scroll-behavior | CSS, CSS Property, CSSOM View, Reference |
The scroll-behavior CSS property sets the behavior for a scrolling box when scrolling is triggered by the navigation or CSSOM scrolling APIs. |
||
902 | scroll-margin | CSS, Reference, scroll-margin |
The scroll-margin property is a shorthand property which sets all of the scroll-margin longhands, assigning values much like the margin property does for the margin-* longhands. |
||
903 | scroll-margin-block | |
The scroll-margin-block property is a shorthand property which sets the scroll-margin longhands in the block dimension. |
||
904 | scroll-margin-block-end | |
The scroll-margin-block-end property defines the margin of the scroll snap area at the end of the block dimension that is used for snapping this box to the snapport. The scroll snap area is determined by taking the transformed border box, finding its rectangular bounding box (axis-aligned in the scroll container’s coordinate space), then adding the specified outsets. |
||
905 | scroll-margin-block-start | |
The scroll-margin-block-start property defines the margin of the scroll snap area at the start of the block dimension that is used for snapping this box to the snapport. The scroll snap area is determined by taking the transformed border box, finding its rectangular bounding box (axis-aligned in the scroll container’s coordinate space), then adding the specified outsets. |
||
906 | scroll-margin-bottom | |
The scroll-margin-bottom property defines the bottom margin of the scroll snap area that is used for snapping this box to the snapport. The scroll snap area is determined by taking the transformed border box, finding its rectangular bounding box (axis-aligned in the scroll container’s coordinate space), then adding the specified outsets. |
||
907 | scroll-margin-inline | |
The scroll-margin-inline property is a shorthand property which sets the scroll-margin longhands in the inline dimension. |
||
908 | scroll-margin-inline-end | |
The scroll-margin-inline-end property defines the margin of the scroll snap area at the end of the inline dimension that is used for snapping this box to the snapport. The scroll snap area is determined by taking the transformed border box, finding its rectangular bounding box (axis-aligned in the scroll container’s coordinate space), then adding the specified outsets. |
||
909 | scroll-margin-inline-start | |
The scroll-margin-inline-start property defines the margin of the scroll snap area at the start of the inline dimension that is used for snapping this box to the snapport. The scroll snap area is determined by taking the transformed border box, finding its rectangular bounding box (axis-aligned in the scroll container’s coordinate space), then adding the specified outsets. |
||
910 | scroll-margin-left | |
The scroll-margin-left property defines the left margin of the scroll snap area that is used for snapping this box to the snapport. The scroll snap area is determined by taking the transformed border box, finding its rectangular bounding box (axis-aligned in the scroll container’s coordinate space), then adding the specified outsets. |
||
911 | scroll-margin-right | |
The scroll-margin-right property defines the right margin of the scroll snap area that is used for snapping this box to the snapport. The scroll snap area is determined by taking the transformed border box, finding its rectangular bounding box (axis-aligned in the scroll container’s coordinate space), then adding the specified outsets. |
||
912 | scroll-margin-top | |
The scroll-margin-top property defines the top margin of the scroll snap area that is used for snapping this box to the snapport. The scroll snap area is determined by taking the transformed border box, finding its rectangular bounding box (axis-aligned in the scroll container’s coordinate space), then adding the specified outsets. |
||
913 | scroll-padding | |
The scroll-padding property is a shorthand property which sets all of the scroll-padding longhands, assigning values much like the padding property does for the padding-* longhands. The scroll-padding properties define offsets for the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
914 | scroll-padding-block | |
The scroll-padding-block property is a shorthand property which sets the scroll-padding longhands for the block dimension.The scroll-padding properties define offsets for the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
915 | scroll-padding-block-end | |
The scroll-padding-block-end property defines offsets for the end edge in the block dimension of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
916 | scroll-padding-block-start | |
The scroll-padding-block-start property defines offsets for the start edge in the block dimension of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
917 | scroll-padding-bottom | |
The scroll-padding-bottom property defines offsets for the bottom of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
918 | scroll-padding-inline | |
The scroll-padding-inline property is a shorthand property which sets the scroll-padding longhands for the inline dimension.The scroll-padding properties define offsets for the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
919 | scroll-padding-inline-end | |
The scroll-padding-inline-end property defines offsets for the end edge in the inline dimension of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
920 | scroll-padding-inline-start | |
The scroll-padding-inline-start property defines offsets for the start edge in the inline dimension of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
921 | scroll-padding-left | |
The scroll-padding-left property defines offsets for the left of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
922 | scroll-padding-right | |
The scroll-padding-right property defines offsets for the right of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
923 | scroll-padding-top | |
The scroll-padding-top property defines offsets for the top of the optimal viewing region of the scrollport: the region used as the target region for placing things in view of the user. This allows the author to exclude regions of the scrollport that are obscured by other content (such as fixed-positioned toolbars or sidebars) or simply to put more breathing room between a targetted element and the edges of the scrollport. |
||
924 | scroll-snap-align | |
The scroll-snap-align property specifies the box’s snap position as an alignment of its snap area (as the alignment subject) within its snap container’s snapport (as the alignment container). The two values specify the snapping alignment in the block axis and inline axis, respectively. If only one value is specified, the second value defaults to the same value. |
||
925 | scroll-snap-coordinate | CSS, CSS Property, CSS Scroll Snap, Deprecated, Reference |
The scroll-snap-coordinate CSS property defines the x and y coordinate positions within an element that will align with its nearest ancestor scroll container's scroll-snap-destination for each respective axis. |
||
926 | scroll-snap-destination | CSS, CSS Property, CSS Scroll Snap, Deprecated, Reference |
The scroll-snap-destination CSS property defines the position in x and y coordinates within the scroll container's visual viewport which element snap points align with. |
||
927 | scroll-snap-points-x | CSS, CSS Property, CSS Scroll Snap, Deprecated, Reference |
The scroll-snap-points-x CSS property defines the horizontal positioning of snap points within the content of the scroll container they are applied to. |
||
928 | scroll-snap-points-y | CSS, CSS Property, CSS Scroll Snap, Deprecated, Reference |
The scroll-snap-points-y CSS property defines the vertical positioning of snap points within the content of the scroll container they are applied to. |
||
929 | scroll-snap-stop | CSS, CSS Scroll Snap, Reference, Web, scroll-snap-stop |
The scroll-snap-stop CSS property defines whether the scroll container is allowed to "pass over" possible snap positions. |
||
930 | scroll-snap-type | CSS, CSS Property, CSS Scroll Snap, Experimental, Reference |
The scroll-snap-type CSS property sets how strictly snap points are enforced on the scroll container in case there is one. |
||
931 | scroll-snap-type-x | CSS, CSS Property, CSS Scroll Snap, NeedsExample, Non-standard, Reference |
The scroll-snap-type-x CSS property defines how strictly snap points are enforced on the horizontal axis of the scroll container in case there is one. |
||
932 | scroll-snap-type-y | CSS, CSS Property, CSS Scroll Snap, NeedsExample, Non-standard, Reference |
The scroll-snap-type-y CSS property defines how strictly snap points are enforced on the vertical axis of the scroll container in case there is one. |
||
933 | scrollbar-color | CSS, CSS Property, Reference, css scrollbars, scrollbar-color |
The scrollbar-color CSS property sets the color of the scrollbar track and thumb. |
||
934 | scrollbar-width | CSS, CSS Property, Reference, css scrollbars, scrollbar-width |
The scrollbar-width property allows the author to set the maximum thickness of an element’s scrollbars when they are shown. |
||
935 | shape-image-threshold | Boundaries, CSS, CSS Property, CSS Shapes, Float Area, Opacity, Property, Reference, Shape, shape-image-threshold |
The shape-image-threshold CSS property sets the alpha channel threshold used to extract the shape using an image as the value for shape-outside . |
||
936 | shape-margin | Boundaries, CSS, CSS Property, CSS Shapes, Float Area, Property, Reference, Shape, float, margin, shape-margin |
The shape-margin CSS property sets a margin for a CSS shape created using shape-outside . |
||
937 | shape-outside | Boundaries, CSS, CSS Property, CSS Shapes, Float Area, Property, Reference, Shape, margin, shape-outside, wrapping |
The shape-outside CSS property defines a shape—which may be non-rectangular—around which adjacent inline content should wrap. |
||
938 | symbols() | CSS, CSS Counter Styles, Reference |
The symbols() CSS function lets you define counter styles inline, directly as the value of a property such as list-style . Unlike @counter-style , symbols() is anonymous (i.e., it can only be used once). Although less powerful, it is shorter and easier to write than @counter-style . |
||
939 | tab-size | CSS, CSS Property, CSS Text, Experimental, Reference |
The tab-size CSS property is used to customize the width of a tab (U+0009 ) character. |
||
940 | table-layout | CSS, CSS Property, CSS Tables, Reference |
The table-layout CSS property sets the algorithm used to lay out <table> cells, rows, and columns. |
||
941 | text-align | CSS, CSS Property, CSS Text, Reference |
The text-align CSS property sets the horizontal alignment of a block element or table-cell box. This means it works like vertical-align but in the horizontal direction. |
||
942 | text-align-last | CSS, CSS Property, CSS Text, Experimental, Reference |
The text-align-last CSS property sets how the last line of a block or a line, right before a forced line break, is aligned. |
||
943 | text-combine-upright | CSS, CSS Property, CSS Writing Modes, Experimental, Reference |
The text-combine-upright CSS property sets the combination of characters into the space of a single character. |
||
944 | text-decoration | CSS, CSS Property, CSS Text Decoration, Reference |
The text-decoration CSS property sets the appearance of decorative lines on text. It is a shorthand for text-decoration-line , text-decoration-color , and text-decoration-style . |
||
945 | text-decoration-color | CSS, CSS Property, CSS Text, CSS Text Decoration, HTML Colors, HTML Styles, Reference, Styling HTML, Styling text, colors, text-decoration-color |
The text-decoration-color CSS property sets the color of decorations added to text by text-decoration-line . |
||
946 | text-decoration-line | CSS, CSS Property, CSS Text Decoration, Reference |
The text-decoration-line CSS property sets the kind of decoration that is used on text in an element, such as an underline or overline. |
||
947 | text-decoration-skip | CSS, CSS Property, CSS Text Decoration, Experimental, Layout, Reference, Web |
The text-decoration-skip CSS property sets what parts of an element’s content any text decoration affecting the element must skip over. |
||
948 | text-decoration-skip-ink | CSS, CSS Property, CSS Text Decoration, Experimental, Layout, Reference, Web |
The text-decoration-skip-ink CSS property specifies how overlines and underlines are drawn when they pass over glyph ascenders and descenders. |
||
949 | text-decoration-style | CSS, CSS Property, CSS Text Decoration, Layout, Reference |
The text-decoration-style CSS property sets the style of the lines specified by text-decoration-line . The style applies to all lines that are set with text-decoration-line . |
||
950 | text-emphasis | CSS, CSS Property, CSS Text Decoration, Reference |
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 . |
||
951 | text-emphasis-color | CSS, CSS Property, CSS Styles, CSS Text Decoration, HTML Colors, Reference, Styling HTML, Text Emphasis, text-decoration-color |
The text-emphasis-color CSS property sets the color of emphasis marks. This value can also be set using the text-emphasis shorthand. |
||
952 | text-emphasis-position | CSS, CSS Property, CSS Text Decoration, Reference |
The text-emphasis-position CSS property sets where emphasis marks are drawn. Like ruby text, if there isn't enough room for emphasis marks, the line height is increased. |
||
953 | text-emphasis-style | CSS, CSS Property, CSS Text Decoration, Reference |
The text-emphasis-style CSS property sets the appearance of emphasis marks. It can also be set, and reset, using the text-emphasis shorthand. |
||
954 | text-indent | CSS, CSS Property, CSS Text, Layout, Reference |
The text-indent CSS property sets the length of empty space (indentation) that is put before lines of text in a block. |
||
955 | text-justify | CSS, CSS Property, CSS Text, Reference, text-justify |
The text-justify CSS property sets what type of justification should be applied to text when text-align : justify; is set on an element. |
||
956 | text-orientation | CSS, CSS Property, CSS Writing Modes, Experimental, Reference |
The text-orientation CSS property sets the orientation of the text characters in a line. It only affects text in vertical mode (when writing-mode is not horizontal-tb ). |
||
957 | text-overflow | CSS, CSS Property, Reference |
The text-overflow CSS property sets how hidden overflow content is signaled to users. It can be clipped, display an ellipsis ('… '), or display a custom string. |
||
958 | text-rendering | CSS, CSS Property, Legibility, Ligatures, Precision, Reference, SVG, Text, Text Features, Text Rendering |
The text-rendering CSS property provides information to the rendering engine about what to optimize for when rendering text. |
||
959 | text-shadow | CSS, CSS Property, CSS Styles, CSS Text Decoration, HTML Colors, HTML Styles, Reference, Styles, Styling HTML, color |
The text-shadow CSS property adds shadows to text. It accepts a comma-separated list of shadows to be applied to the text and any of its decorations . |
||
960 | text-size-adjust | CSS, CSS Mobile Text Size Adjustment, CSS Property, Experimental, NeedsExample, Reference |
The text-size-adjust CSS property controls the text inflation algorithm used on some smartphones and tablets. Other browsers will ignore this property. |
||
961 | text-transform | CSS, CSS Property, Layout, Reference, Text |
The text-transform CSS property specifies how to capitalize an element's text. It can be used to make text appear in all-uppercase or all-lowercase, or with each word capitalized. It also can help improve legibility for ruby. |
||
962 | text-underline-position | CSS, CSS Property, CSS Text Decoration, Reference |
The text-underline-position CSS property specifies the position of the underline which is set using the text-decoration property's underline value. |
||
963 | top | CSS, CSS Positioning, CSS Property, Reference |
The top CSS property participates in specifying the vertical position of a positioned element. It has no effect on non-positioned elements. |
||
964 | touch-action | CSS, CSS Property, NeedsLiveSample, Pointer Events, Reference |
The touch-action CSS property sets how a region can be manipulated by a touchscreen user (for example, by zooming features built into the browser). |
||
965 | transform | CSS, CSS Property, Reference, Transforms |
The transform CSS property lets you rotate, scale, skew, or translate an element. It modifies the coordinate space of the CSS visual formatting model. |
||
966 | transform-box | CSS, CSS Property, CSS Transforms, Experimental, NeedsExample, Reference |
The transform-box CSS property defines the layout box to which the transform and transform-origin properties relate. |
||
967 | transform-origin | CSS, CSS Property, CSS Transforms, Experimental, Reference |
The transform-origin CSS property sets the origin for an element's transformations. |
||
968 | transform-style | CSS, CSS Property, CSS Transforms, Experimental, Reference |
The transform-style CSS property sets whether children of an element are positioned in the 3D space or are flattened in the plane of the element. |
||
969 | transition | CSS, CSS Property, CSS Transitions, Reference |
The transition CSS property is a shorthand property for transition-property , transition-duration , transition-timing-function , and transition-delay . |
||
970 | transition-delay | CSS, CSS Property, CSS Transitions, Reference |
The transition-delay CSS property specifies the duration to wait before starting a property's transition effect when its value changes. |
||
971 | transition-duration | CSS, CSS Property, CSS Transitions, Reference |
The transition-duration CSS property sets the length of time a transition animation should take to complete. By default, the value is 0s , meaning that no animation will occur. |
||
972 | transition-property | CSS, CSS Property, CSS Transitions, Reference |
The transition-property CSS property sets the CSS properties to which a transition effect should be applied. |
||
973 | transition-timing-function | CSS, CSS Property, CSS Transitions, Reference |
The transition-timing-function CSS property sets how intermediate values are calculated for CSS properties being affected by a transition effect. |
||
974 | translate | CSS, CSS Property, Experimental, Reference, Transforms |
The translate CSS property allows you to specify translation transforms individually and independantly of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform value. |
||
975 | unicode-bidi | BiDi, CSS, CSS Property, Reference |
The unicode-bidi CSS property, together with the direction property, determines how bidirectional text in a document is handled. For example, if a block of content contains both left-to-right and right-to-left text, the user-agent uses a complex Unicode algorithm to decide how to display the text. The unicode-bidi property overrides this algorithm and allows the developer to control the text embedding. |
||
976 | unset | CSS, CSS Cascade, CSS Value, Layout, Reference, Style, unset |
The unset CSS keyword resets a property to its inherited value if it inherits from its parent, and to its initial value if not. |
||
977 | user-modify | CSS, CSS Property, CSS:Mozilla Extensions, CSS:WebKit Extensions, Deprecated, Non-standard, Reference |
The user-modify property has no effect in Firefox. It was originally planned to determine whether or not the content of an element can be edited by a user. |
||
978 | user-select | CSS, CSS Property, Reference, user-select |
The user-select CSS property controls whether the user can select text. This doesn't have any effect on content loaded as chrome, except in textboxes. |
||
979 | var() | CSS, CSS Custom Properties, CSS Function, CSS Variables, Experimental, Reference, Variables, var, var() |
The var() CSS function can be used to insert the value of a custom property (sometimes called a "CSS variable") instead of any part of a value of another property. |
||
980 | vertical-align | CSS, CSS Property, Reference |
The vertical-align CSS property sets vertical alignment of an inline or table-cell box. |
||
981 | visibility | CSS, CSS Box Model, CSS Property, Layout, Reference, Web |
The visibility CSS property shows or hides an element without changing the layout of a document. The property can also hide rows or columns in a <table> . |
||
982 | white-space | CSS, CSS Property, CSS Text, Reference, white-space |
The white-space CSS property sets how white space inside an element is handled. |
||
983 | widows | CSS, CSS Fragmentation, CSS Multi-column Layout, CSS Property, Reference |
The widows CSS property sets the minimum number of lines in a block container that must be shown at the top of a page, region, or column. |
||
984 | width | CSS, CSS Property, Reference, dimensions, size, width |
The width CSS property sets an element's width. By default it sets the width of the content area, but if box-sizing is set to border-box , it sets the width of the border area. |
||
985 | will-change | CSS, CSS Property, CSS Will-change, Performance, Reference, Transitions |
The will-change CSS property hints to browsers how an element is expected to change. Browsers may set up optimizations before an element is actually changed. |
||
986 | word-break | CSS, CSS Property, Reference |
The word-break CSS property sets whether line breaks appear wherever the text would otherwise overflow its content box. |
||
987 | word-spacing | CSS, CSS Property, CSS Text, Reference |
The word-spacing CSS property sets the length of space between words and between tags. |
||
988 | writing-mode | CSS, CSS Property, Layout, Reference |
The writing-mode CSS property sets whether lines of text are laid out horizontally or vertically, as well as the direction in which blocks progress. |
||
989 | z-index | CSS, CSS Positioning, CSS Property, Reference |
The z-index CSS property sets the z-order of a positioned element and its descendants or flex items. Overlapping elements with a larger z-index cover those with a smaller one. |
||
990 | zoom | CSS, CSS Property, Non-standard, Reference |
The non-standard zoom CSS property can be used to control the magnification level of an element. |
||