2020
30 featuresThe i identifier in a CSS attribute selector matches attribute values case-insensitively in document languages like XML where attribute values are case-sensitive.
The :focus-within CSS pseudo-class matches an element if the element or any of its children are focused.
The :scope CSS pseudo-class matches the scoping root, for instance the element that querySelector() is called on, or the root of a DOM subtree specified with @scope.
The :link CSS pseudo-class matches unvisited links, :visited matches visited links, and :any-link matches both.
The WEBGL_compressed_texture_astc extension for WebGL 1.0 and 2.0 contexts adds the Adaptive Scalable Texture Compression format to compressedTexImage2D() and compressedTexSubImage2D().
The CSS.supports() static method returns whether the browser supports a CSS declaration (given by two arguments, a property and value) or an @supports at-rule condition string.
The CSS.escape() static method escapes a string so that it can be used in a valid CSS selector.
The unicode-bidi and direction CSS properties override the Unicode layout algorithm. They are intended for Document Type Definition (DTD) designers. For HTML documents, you should use the dir global HTML attribute and <bdo> HTML element instead.
The display: flow-root CSS declaration sets an element as the root element of a new flow layout for its children, preventing margin collapse with sibling elements.
The :host CSS pseudo-class selects the containing element of the shadow tree in which it is used. The :host() CSS pseudo-class selects the that element only if it matches the provided selector.
CSS scroll snap controls the panning and scrolling behavior within a scroll container.
The EventSource API creates a connection to a server and listens to a stream of events sent by the server.
The object-fit CSS property sets how images, videos, and other replaced elements are scaled within their container.
The object-position CSS property places images, videos, and other replaced elements within their boxes.
The <animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.
The min-content and max-content CSS keywords represent the smallest and largest intrinsic sizes of an element.
The document.elementFromPoint() and document.elementsFromPoint() methods find the top-most element at a given point in the viewport, or all elements at a given point in the viewport, respectively.
Asynchronous iterator objects, such as those returned by promises or generator functions, are iterable with the for await .. of loop.
The ::placeholder CSS pseudo-element selects help text in <input> and <textarea> elements when no value is set.
The :placeholder-shown CSS pseudo-element selects <input> and <textarea> elements when no value is set and the element's placeholder attribute is not empty. Not to be confused with ::placeholder, which selects the placeholder text itself.
The document.fonts API dynamically loads custom fonts and tracks when fonts are loading or ready to use.
The captureStream() method for <canvas> elements returns a MediaStream which includes a CanvasCaptureMediaStreamTrack representing real-time video of the canvas image. You can use this to record the canvas, or send it elsewhere, such as another canvas or WebRTC connection.
The all CSS property is a shorthand for all CSS properties, except for direction and unicode-bidi. It accepts only the keywords for explicit defaulting (such as initial and inherit), since they are the only values supported on all CSS properties.
The background-blend-mode CSS property blends an element's background image and background color using blend modes like multiply, difference, or color.
The isolation CSS property creates a new stacking context, which impacts z-index ordering and blend modes.
The mix-blend-mode CSS property blends an element's content with its background or parent elements using blend modes like multiply, difference, or color.
The mask-type CSS property on an SVG <mask> element sets whether the mask is a luminance or alpha mask.
The shape-outside CSS property, along with shape-margin and shape-image-threshold, sets the shape around which adjacent content will wrap.