CSSOM e Stili Calcolati

Overview

Il modello oggetto CSS trasforma il testo dei fogli di stile in oggetti attivi che partecipano a una vera cascata. CSSStyleSheet contiene le regole, CSSStyleDeclaration contiene le dichiarazioni delle proprietà e Element.get_computed_style() riporta il risultato risolto.

Analisi e Collegamento dei Fogli di Stile

CSSStyleSheet.replace_sync() analizza il testo del foglio di stile; Document.attach_style_sheet() registra il foglio in modo che le sue regole vengano applicate. Le regole possono anche essere gestite individualmente con insert_rule(), add_rule() e 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)

La Famiglia di Regole

I fogli analizzati contengono regole tipizzate: CSSStyleRule per selettori ordinari più CSSMediaRule, CSSKeyframesRule, CSSFontFaceRule, CSSSupportsRule, CSSImportRule e varianti pagina/strato/spazio dei nomi, raccolte in un CSSRuleList. parse_stylesheet() e parse_rule_text() espongono direttamente lo strato di parsing.

Dichiarazioni e Stili Inline

La proprietà style di ogni elemento è un CSSStyleDeclaration live: set_property(), get_property_value(), get_property_priority() e item() dichiarazioni di lettura e scrittura. Le dichiarazioni inline hanno la precedenza sulle regole dell’autore di qualsiasi specificità del selettore:

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

Risoluzione della cascata

Element.get_computed_style() restituisce un ComputedStyleDeclaration che riflette specificità, importanza e ereditarietà. Una regola dell’autore contrassegnata !important supera una dichiarazione inline non importante:

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

Suggerimenti e migliori pratiche

• Allega i fogli prima di leggere gli stili calcolati — la risoluzione riflette i fogli attualmente allegati
• Usa get_property_priority() per verificare !important quando si debugga risultati inaspettati
• Mantieni un CSSStyleSheet per foglio di stile logico; CSSRuleList conserva l’ordine delle regole, che è importante per i pareggi di specificità uguale
• Per i controlli di ereditarietà, leggi prima il valore calcolato del genitore, poi quello del figlio

Problemi comuni

FAQ

Come posso analizzare il testo CSS in oggetti?

CSSStyleSheet.replace_sync() per fogli interi, oppure parse_rule_text() per una singola regola.

Cosa restituisce get_computed_style?

Un ComputedStyleDeclaration — leggi i valori con get_property_value().

Gli stili inline vincono sempre?

Superano le regole dell’autore di qualsiasi specificità, ma perdono contro le regole dell’autore contrassegnate !important.

API Reference Riepilogo

Vedi anche

• Aspose.HTML for Python — Enterprise Documentation