emmet lib

.gitignore

.sass-cache
*css.map

README.md

Genera css

sass -t expanded styles.scss:styles.css

build_css_from_html.py

# Read a HTML file and spit its CSS skeletor
from bs4 import BeautifulSoup

def make_rule(name,type=0):
    id_or_class = ['.','#']
    variable = """
{}{} {{

}}
""".format(id_or_class[type],name)
    return variable

file = open('t.html')
content = file.read()
soup = BeautifulSoup(content,'html.parser')

classes = []
ids = []

for ele in soup.find_all(class_=True):
    classes.extend(ele['class'])

for ele in soup.find_all(True,{'id':True}):
    ids.append(ele.get('id'))

# classes
unique = []
[unique.append(item) for item in classes if item not in unique]

# main
for id in ids:
  print(make_rule(id,1))

for cl in unique:
  print(make_rule(cl))

emmet-lib.html

nav.nav>ul.nav__menu>li.nav__item*5>a[href="#"].nav__link{item}

<nav class="nav">
  <ul class="nav__menu">
    <li class="nav__item"><a class="nav__link" href="#">item</a></li>
    <li class="nav__item"><a class="nav__link" href="#">item</a></li>
    <li class="nav__item"><a class="nav__link" href="#">item</a></li>
    <li class="nav__item"><a class="nav__link" href="#">item</a></li>
    <li class="nav__item"><a class="nav__link" href="#">item</a></li>
  </ul>
</nav>

styles.css

.nav__menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.nav__item {
  border: 1px solid red;
}
.nav__link {
  color: red;
  display: block;
}

/*# sourceMappingURL=styles.css.map */

styles.scss

.nav {

  &__menu {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  &__item {
    border:1px solid red;
  }

  &__link {
    color: red;
    display: block;
  }

}