Table of Contents

Class CssComputedStyle

Namespace
Egami.Css
Assembly
Egami.Css.dll

An element's computed style, as far as CSS defines it generically: CSS-wide keywords resolved, inheritance applied, custom properties and var() substituted. Values stay component values; the consumer parses each property by its type (and resolves relative units, percentages and currentcolor).

public sealed class CssComputedStyle : IEnumerable<KeyValuePair<string, IReadOnlyList<CssComponentValue>>>, IEnumerable
Inheritance
CssComputedStyle
Implements
Inherited Members

Examples

// The registry says which properties inherit and their initial values; consumers add their own.
CssPropertyRegistry registry = CssPropertyRegistry.CreateDefault();
registry.Register(new CssPropertyDefinition("fill", Inherited: true, InitialValue: "black")
{
    Validate = value => CssColor.TryParse(value, out _),
});
registry.RegisterShorthand(new CssShorthandDefinition("marker", ["marker-start", "marker-end"],
    value => [new CssDeclaration("marker-start", value), new CssDeclaration("marker-end", value)]));

CssStyleSheet userAgent = CssStyleSheet.Parse("rect { fill: gray }");
CssStyleSheet author = CssStyleSheet.Parse("""
    svg { --accent: teal; font: 12px sans-serif }
    .layer { fill: var(--accent) }
    #r { fill: inherit; opacity: 0.5 }
    """);
var cascade = new CssCascade(
    [(userAgent, CssOrigin.UserAgent), (author, CssOrigin.Author)],
    new CssCascadeOptions { Registry = registry, Media = new CssMediaContext { Width = 800 } });

// Cascade each element (presentation attributes as hints, the style attribute as inline style), then compute it
// from its parent's computed style.
CssComputedStyle rootStyle = cascade.Compute(cascade.Cascade(root), null);
CssComputedStyle groupStyle = cascade.Compute(cascade.Cascade(group), rootStyle);
CssCascadedStyle cascaded = cascade.Cascade(rect,
    presentationHints: [CssDeclaration.Create("fill", "red")],
    inlineStyle: CssDeclaration.ParseList("stroke: blue"));
CssComputedStyle style = cascade.Compute(cascaded, groupStyle);

cascaded.TryGetDeclaration("fill", out CssDeclaration? winner, out CssOrigin origin); // fill: inherit, Author
string? fill = style.GetValueText("fill");           // "teal": inherited, var() substituted
string? fontSize = style.GetValueText("font-size");  // "12px": from the font shorthand, inherited
if (style.TryGetValue("opacity", out IReadOnlyList<CssComponentValue>? opacity))
{
    // The consumer parses each property by its type.
}

Remarks

A computed style stores only what its element sets and shares the rest with its parent: inherited properties are looked up through the parent chain, and the others fall back to their initial value from the registry. Enumerating a computed style lists the properties with a value that the element or an ancestor set (not initial values).

Properties

Parent

Gets the parent element's computed style, or null for the root.

public CssComputedStyle? Parent { get; }

Property Value

CssComputedStyle

Methods

Compute(CssCascadedStyle, CssComputedStyle?, CssPropertyRegistry)

Computes an element's style: resolves inherit, initial, unset, revert and revert-layer (treated as revert), applies inheritance, and substitutes var() with fallbacks and cycle detection. A property whose substitution fails is invalid at computed-value time and behaves as unset.

public static CssComputedStyle Compute(CssCascadedStyle cascaded, CssComputedStyle? parent, CssPropertyRegistry registry)

Parameters

cascaded CssCascadedStyle

The element's cascaded style.

parent CssComputedStyle

The parent element's computed style, or null for the root.

registry CssPropertyRegistry

The property registry (inheritance, initial values, shorthands, validation).

Returns

CssComputedStyle

The computed style.

CreateInherited(CssComputedStyle?, CssPropertyRegistry)

Creates the computed style of an element no declaration applies to.

public static CssComputedStyle CreateInherited(CssComputedStyle? parent, CssPropertyRegistry registry)

Parameters

parent CssComputedStyle

The parent's computed style, or null for the root.

registry CssPropertyRegistry

The property registry.

Returns

CssComputedStyle

The computed style: inherited and initial values only.

GetEnumerator()

Enumerates the properties with a value that this element or an ancestor set.

public IEnumerator<KeyValuePair<string, IReadOnlyList<CssComponentValue>>> GetEnumerator()

Returns

IEnumerator<KeyValuePair<string, IReadOnlyList<CssComponentValue>>>

The properties and their values.

GetValueText(string)

Gets a property's computed value as CSS text, or null when it has none.

public string? GetValueText(string name)

Parameters

name string

The property name.

Returns

string

The value text.

IsSetOnElement(string)

Gets whether the element itself sets the property (rather than inheriting it or taking its initial value).

public bool IsSetOnElement(string name)

Parameters

name string

The property name.

Returns

bool

True when the element's own declarations set it.

TryGetValue(string, out IReadOnlyList<CssComponentValue>?)

Gets a property's computed value.

public bool TryGetValue(string name, out IReadOnlyList<CssComponentValue>? value)

Parameters

name string

The property name (lowercase, or a custom property name as written).

value IReadOnlyList<CssComponentValue>

The value as component values.

Returns

bool

True when the property has a value: set, inherited or initial.