Jak pracować z CSSOM w Python

Aspose.HTML FOSS dla Python implementuje model obiektowy CSS: arkusze stylów są parsowane do żywych obiektów reguł, dołączane do dokumentów i rozwiązywane przez prawdziwą kaskadę. Ten przewodnik stylizuje element i odczytuje wynik obliczony, używając pip do instalacji.

Przewodnik krok po kroku

Krok 1: Zainstaluj pakiet

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

Krok 2: Zaimportuj wymagane klasy

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

Krok 3: Zbuduj stylowany element

Utwórz dokument i element z klasą oraz identyfikatorem — oba będą uczestniczyć w dopasowywaniu selektorów:

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

Krok 4: Analiza i dołączenie arkusza stylów

replace_sync() analizuje tekst arkusza stylów; attach_style_sheet() rejestruje go w dokumencie:

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

Krok 5: Odczyt stylu obliczonego

Selektor ID (specyficzność 1,0,0) ma wyższy priorytet niż selektor klasy (0,1,0), więc wygrywa niebieski:

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

Typowe problemy i rozwiązania

Obliczona wartość ignoruje mój arkusz stylów. Arkusz musi być dołączony za pomocą Document.attach_style_sheet() before get_computed_style() nazywa się.

Styl inline przegrywa z regułą z arkusza stylów. Reguły autora oznaczone !important przewyższają nieważne deklaracje inline; sprawdź priorytety za pomocą get_property_priority().

Dwie reguły o tej samej specyficzności dają zaskakującego zwycięzcę. Późniejsze reguły wygrywają w remisach o równej specyficzności — kolejność reguł w arkuszu ma znaczenie.

Najczęściej zadawane pytania

Jak ustawić style inline programowo?

Poprzez deklarację style elementu: przypisz ją do zmiennej i wywołaj set_property() na niej.

Jakiego obiektu zwraca get_computed_style?

Obiekt ComputedStyleDeclaration; odczytaj wartości za pomocą get_property_value().

Czy reguły media, keyframes i font-face są modelowane?

Tak — przetworzone arkusze zawierają typowane reguły, w tym CSSMediaRule, CSSKeyframesRule i CSSFontFaceRule w CSSRuleList.