Come lavorare con il CSSOM in Python

Aspose.HTML FOSS per Python implementa il modello oggetto CSS: i fogli di stile vengono analizzati in oggetti regola live, collegati ai documenti e risolti tramite una vera cascata. Questa guida applica uno stile a un elemento e legge il risultato calcolato, usando pip per l’installazione.

Guida passo passo

Passo 1: Installa il pacchetto

git clone https://github.com/aspose-html-foss/Aspose.HTML-FOSS-for-Python.git
cd Aspose.HTML-FOSS-for-Python
pip install -e .

Passo 2: Importa le classi necessarie

from aspose_html.dom import Document
from aspose_html.cssom import CSSStyleSheet

Passo 3: Crea un elemento stilizzato

Crea un documento e un elemento con una classe e un id — entrambi parteciperanno al confronto dei selettori:

doc = Document()
el = doc.create_element("div")
el.set_attribute("class", "foo")
el.set_attribute("id", "bar")
doc.append_child(el)

Passo 4: Analizza e allega un foglio di stile

replace_sync() analizza il testo del foglio di stile; attach_style_sheet() lo registra nel documento:

sheet = CSSStyleSheet()
sheet.replace_sync(".foo { color: red } #bar { color: blue }")
doc.attach_style_sheet(sheet)

Passo 5: Leggi lo stile calcolato

Il selettore ID (specificità 1,0,0) supera il selettore di classe (0,1,0), quindi il blu vince:

style = el.get_computed_style()
print(style.get_property_value("color"))

Problemi comuni e soluzioni

Il valore calcolato ignora il mio foglio di stile. Il foglio deve essere allegato tramite Document.attach_style_sheet() before get_computed_style() si chiama.

Uno stile inline perde contro una regola del foglio di stile. Regole dell’autore contrassegnate !important prevalgono sulle dichiarazioni inline non importanti; ispeziona le priorità con get_property_priority().

Due regole con la stessa specificità producono un vincitore sorprendente. Le regole successive vincono i pareggi di specificità uguale — l’ordine delle regole all’interno del foglio è importante.

Domande frequenti

Come impostare gli stili inline programmaticamente?

Attraverso la dichiarazione style dell’elemento: assegnala a una variabile e chiama set_property() su di essa.

Quale oggetto restituisce get_computed_style?

Un ComputedStyleDeclaration; leggi i valori con get_property_value().

Le regole media, keyframes e font-face sono modellate?

Sì — i fogli analizzati contengono regole tipizzate includendo CSSMediaRule, CSSKeyframesRule e CSSFontFaceRule in un CSSRuleList.