Nástroj extractCSS dokáže v HTML kódu najít elementy, které mají nastavenou třídu nebo ID a vytvořit pro ně CSS předpis. Když element s class/id bude mít nějaké inline styly (např. style="color: red"), bude i toto rovnou převedeno do externího CSS.

Využití

K čemu je to dobré? Kromě extrahování inline stylů to může posloužit i ke zrychlení tvorby CSS k existujícímu HTML.

Navrhneme si strukturu HTML kódu s třídami a extractCSS z toho připraví kostru pro vytváření CSS.

HTML

<div class="obal">
  <div class="hlavicka"></div>
  <div class="obash"></div>
  <div class="menu"></div>
  <div class="paticka"></div>
</div>

To jde mimochodem s nástrojem Emmet zapsat jako .obal>(.hlavicka+.obash+.menu+.paticka).

CSS

extractCSS

Odpovídající a automaticky vygenerovaná CSS kostra bude vypadat následovně:

.obal {
}

.hlavicka {
}

.obash {
}

.menu {
}

.paticka {
}