CSS

edit

The library parses CSS as a browser does and applies it with the cascade of the browsers: the style elements, the linked style sheets, the style attributes, the user agent style sheet, the media queries, @layer, @container, @scope, the nesting and the custom properties. The results are exposed by the CSS Object Model (CSSOM) of the browsers.

var html = """
    <style>.important { color: red; font-weight: bold }</style>
    <p class="important">Hello</p>
    """;

using var context = new BrowsingContext(new BrowsingContextOptions
{
    Viewport = new ViewportOptions { Width = 1280, Height = 720 }, // optional, 800x600 by default
});

var document = context.Navigate("https://example.com/", _ => html);
var style = context.Window.GetComputedStyle(document.QuerySelector(".important")!);
Assert.Equal("rgb(255, 0, 0)", style.Color);
Assert.Equal("700", style.GetPropertyValue("font-weight"));

What needs a browsing context

The style sheets and the style attributes are parsed in every document, so you can read and edit them in a document parsed by HtmlDocumentParser. The cascade needs a window and a viewport: the computed styles, the media queries and the layout only exist in the documents of a browsing context. The style sheets of the <link rel=stylesheet> elements and of the @import rules are fetched by the document loader of the browsing context.

In this section

  • Computed styles: the final value of every property of an element, after the cascade and the layout.
  • Style sheets: read, edit and create style sheets and rules; inspect their selectors.
  • Typed values: read and write CSS values as numbers with units, keywords and transforms.
  • Formatting CSS: write style sheets minified or indented.