Как работать с CSSOM в Python

Aspose.HTML FOSS для Python реализует объектную модель CSS: таблицы стилей разбираются в живые объекты правил, привязываются к документам и разрешаются через реальный каскад. Это руководство стилизует элемент и читает вычисленный результат, используя pip для установки.

Пошаговое руководство

Шаг 1: Установите пакет

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

Шаг 2: Импортируйте необходимые классы

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

Шаг 3: Создайте стилизованный элемент

Создайте документ и элемент с классом и id — оба будут участвовать в сопоставлении селекторов:

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

Шаг 4: Разобрать и присоединить таблицу стилей

replace_sync() разбирает текст таблицы стилей; attach_style_sheet() регистрирует её в документе:

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

Шаг 5: Прочитать вычисленный стиль

Селектор по ID (специфичность 1,0,0) имеет приоритет над селектором класса (0,1,0), поэтому выигрывает синий:

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

Распространённые проблемы и их решения

Вычисленное значение игнорирует мою таблицу стилей. Таблица должна быть подключена через Document.attach_style_sheet() before get_computed_style() называется.

Встроенный стиль уступает правилу таблицы стилей. Авторские правила, помеченные !important имеют более высокий приоритет, чем неважные встроенные объявления; проверьте приоритеты с помощью get_property_priority().

Два правила с одинаковой специфичностью дают неожиданного победителя. Поздние правила выигрывают в связках с равной специфичностью — порядок правил внутри листа имеет значение.

Часто задаваемые вопросы

Как программно установить встроенные стили?

Через объявление style элемента: присвойте его переменной и вызовите set_property().

Какой объект возвращает get_computed_style?

Это ComputedStyleDeclaration; прочитайте значения с помощью get_property_value().

Моделируются ли правила media, keyframes и font-face?

Да — разобранные листы содержат типизированные правила, включая CSSMediaRule, CSSKeyframesRule и CSSFontFaceRule в CSSRuleList.