Skip to main content

Styles

Applies the given styles to a shadowRoot. When Shadow DOM is available but adoptedStyleSheets is not, styles are appended to the shadowRoot to mimic spec behavior. Note, when shimming is used, any styles that are subsequently placed into the shadowRoot should be placed before any shimmed adopted styles. This will match spec behavior that gives adopted sheets precedence over styles in shadowRoot.

Import

Signature

adoptStyles(renderRoot, styles): void

Parameters

renderRoot
MDN ShadowRoot
styles
CSSResultFlatArray

Template tag which which can be used with LitElement's styles property to set element styles. For security reasons, only literal string values may be used. To incorporate non-literal values unsafeCSS may be used inside a template string part.

Import

Signature

css(strings, values): CSSResultGroup

Parameters

strings
TemplateStringsArray
values
Array<number | CSSResultGroup>

Import

Methods and properties

new CSSResult(cssText, safeToken): CSSResult

Permalink to constructor
Parameters
cssText
string
safeToken
symbol

readonly cssText: string

Permalink to cssText View source

Import

Signature

getCompatibleStyle(s): CSSResultOrNative

Parameters

s
CSSResultOrNative

Whether the current browser supports adoptedStyleSheets.

Import

Type

boolean

Wrap a value for interpolation in a css tagged template literal.

Import

Signature

unsafeCSS(value): CSSResult

Parameters

value
unknown

Details

This is unsafe because untrusted CSS text can be used to phone home or exfiltrate data to an attacker controlled site. Take care to only use this with trusted input.

Import

Type

Array<CSSResultOrNative | CSSResultArray>

Import

Type

Array<CSSResultOrNative>

Import

Type

CSSResultOrNative | CSSResultArray

Import

Type

CSSResult | MDN CSSStyleSheet