CODEWITHSUNDEEP
pythoncsstinycss
jdm
jdm

Reputation: 10110

Get computed style for an element with tinycss

Given a css stylesheet and some XML / HTML elements, how can I use tinycss to get the computed style of an element?

For example:

p {
  font-family: Arial;
}
.foo {
  color: red;
}

<p><span class="foo"></span></p>

I would like to inspect the inner span element and find out that it has font-family and color set, and possibly some properties have default values (like font-size).

tinycss only seems to be able to parse the css (partially, without the selectors). cssselect can parse the selectors, and give me their specificity. It can take a selector, convert it to xpath, so I can ask "which element matches this selector". But I want to do is almost the opposite: "What is the computed style of this element?"

I could get a list of all selectors matching my element, then all selectors matching all parent elements, and implement the CSS cascading and specificity algorithms, but this strongly seems to be something that would have already been written. In fact it is probably already in tinycss or a related module and I just can't find it - I mean this is probably the main thing you'd want to do with parsed css. Any ideas how to do it with tinycss or otherwise?

Upvotes: 5

Views: 665

Answers (0)

Related Questions