CSSOM och beräknade stilar

CSSOM och Beräknade Stilar

Den CSS objektmodellen omvandlar stilmallstext till levande objekt som deltar i en verklig kaskad. CSSStyleSheet innehåller regler, CSSStyleDeclaration innehåller egenskapsdeklarationer, och Element.get_computed_style() rapporterar det lösta resultatet.

Analysera och bifoga stilmallar

CSSStyleSheet.replace_sync() analyserar stilmallstext; Document.attach_style_sheet() registrerar bladet så att dess regler tillämpas. Regler kan också hanteras individuellt med insert_rule(), add_rule() och 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)

Regelfamiljen

Parserade blad innehåller typade regler: CSSStyleRule för vanliga selektorer plus CSSMediaRule, CSSKeyframesRule, CSSFontFaceRule, CSSSupportsRule, CSSImportRule och sid-/lager-/namnutrymmesvarianter, samlade i en CSSRuleList. parse_stylesheet() och parse_rule_text() exponerar parsingskiktet direkt.

Deklarationer och inline-stilar

Varje elements style-egenskap är en levande CSSStyleDeclaration: set_property(), get_property_value(), get_property_priority() och item() läs- och skrivdeklarationer. Inbäddade deklarationer har företräde framför författarregler oavsett selektorspecificitet:

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"))

Lösa kaskaden

Element.get_computed_style() returnerar en ComputedStyleDeclaration som återspeglar specificitet, vikt och arv. En författarregel markerad med !important slår en icke-viktig inbäddad deklaration:

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 och bästa praxis

• Bifoga blad innan du läser beräknade stilar — upplösningen återspeglar för närvarande bifogade blad
• Använd get_property_priority() för att kontrollera !important när du felsöker överraskande vinnare
• Behåll en CSSStyleSheet per logisk stilmall; CSSRuleList bevarar regelordningen, vilket är viktigt vid lika specificitet-bindningar
• För arvkontroller, läs förälderns beräknade värde först, sedan barnets

Vanliga problem

FAQ

Hur parsar jag CSS-text till objekt?

CSSStyleSheet.replace_sync() för hela blad, eller parse_rule_text() för en enskild regel.

Vad returnerar get_computed_style?

En ComputedStyleDeclaration — läs värden med get_property_value().

Vinner inline-stilar alltid?

De slår författarregler av vilken specificitet som helst, men förlorar mot författarregler märkta !important.

API Reference Sammanfattning

Se även

• Aspose.HTML for Python — Enterprise Documentation