CSSOM en berekende stijlen

Overview

Het CSS objectmodel zet stylesheet-tekst om in live objecten die deelnemen aan een echte cascade. CSSStyleSheet bevat regels, CSSStyleDeclaration bevat eigenschapsdeclaraties, en Element.get_computed_style() rapporteert het opgeloste resultaat.

Parsen en Koppelen van Stylesheets

CSSStyleSheet.replace_sync() parseert stylesheet-tekst; Document.attach_style_sheet() registreert het blad zodat de regels van kracht zijn. Regels kunnen ook individueel worden beheerd met insert_rule(), add_rule() en remove_rule():

from aspose_html.dom import Document
from aspose_html.cssom import CSSStyleSheet
doc = Document()
sheet = CSSStyleSheet()
sheet.replace_sync("div { color: red }")
doc.attach_style_sheet(sheet)

De Regelfamilie

Geparseerde bladen bevatten getypte regels: CSSStyleRule voor gewone selectors plus CSSMediaRule, CSSKeyframesRule, CSSFontFaceRule, CSSSupportsRule, CSSImportRule, en pagina/laag/namespace-varianten, verzameld in een CSSRuleList. parse_stylesheet() en parse_rule_text() exposeren de parse-laag direct.

Declaraties en Inline-stijlen

De style-eigenschap van elk element is een live CSSStyleDeclaration: set_property(), get_property_value(), get_property_priority() en item() lees- en schrijfbepalingen. Inline-bepalingen hebben voorrang op auteursregels van welke selector-specificiteit dan ook:

from aspose_html.dom import Document
from aspose_html.cssom import CSSStyleSheet
doc = Document()
el = doc.create_element("div")
doc.append_child(el)
sheet = CSSStyleSheet()
sheet.replace_sync("div { color: red }")
doc.attach_style_sheet(sheet)
inline = el.style
inline.set_property("color", "blue")
print(el.get_computed_style().get_property_value("color"))

De cascade oplossen

Element.get_computed_style() retourneert een ComputedStyleDeclaration die specificiteit, belangrijkheid en overerving weerspiegelt. Een auteursregel gemarkeerd !important verslaat een niet-belangrijke inline-bepaling:

from aspose_html.dom import Document
from aspose_html.cssom import CSSStyleSheet
doc = Document()
el = doc.create_element("div")
doc.append_child(el)
sheet = CSSStyleSheet()
sheet.replace_sync("div { color: red !important }")
doc.attach_style_sheet(sheet)
inline = el.style
inline.set_property("color", "blue")
print(el.get_computed_style().get_property_value("color"))

Tips en best practices

• Koppel sheets voordat je berekende stijlen leest — de resolutie weerspiegelt de momenteel gekoppelde sheets
• Gebruik get_property_priority() om te controleren op !important bij het debuggen van verrassende winnaars
• Bewaar één CSSStyleSheet per logische stylesheet; CSSRuleList behoudt de volgorde van regels, wat van belang is bij gelijk-specifieke gelijke situaties
• Lees bij overervingscontroles eerst de berekende waarde van de ouder, daarna die van het kind

Algemene problemen

FAQ

Hoe parse ik CSS tekst naar objecten?

CSSStyleSheet.replace_sync() voor volledige bladen, of parse_rule_text() voor een enkele regel.

Wat geeft get_computed_style terug?

Een ComputedStyleDeclaration — lees waarden met get_property_value().

Hebben inline stijlen altijd voorrang?

Ze overtreffen auteursregels van elke specificiteit, maar verliezen van auteursregels gemarkeerd !important.

API Reference Samenvatting

Zie ook

• Aspose.HTML for Python — Enterprise Documentation