Beautifulsoup CSS数据提取

Question

I am attempting to extract css data from an html document. the data points are a variable number of circle xy coordinates generated by the user onto an image and exported into the html as follows:

#shapes a#rage_circle1{
    top: 248px;
    left: 231px;
    width: 18px;
    height: 18px;
    border: 1px solid #000000;
    background-image: none;
}

I would like an output of the top and left pixel numbers.

UPDATED:

this is what I have done so far

from bs4 import BeautifulSoup
import re
soup = BeautifulSoup (open ('index.html'))
x= soup.findAll(text=re.compile('left'))
print (x)

The output generated is all the data between the braces above and is not selecting the "left" string only. I am not sure why my script is not selecting a particular data between the braces. Any suggestions?

Answer 1

I think cssutils is the right choice for your problem. The following snippet will simply output the values of all top and left attributes.

import cssutils
css = cssutils.parseFile('index.html')
for rule in css.cssRules:
    print(rule.style.top)
    print(rule.style.left)