Question

有没有办法将html文档中的硬编码样式提取到外部css文件？如果没有，你对这个怎么做了吗？你以前做过吗？

示例，来自：

<div style="background-color: red">
<a style="font-weight: bold"></a>
</div>

到

<div id='st-01'>
<a id='st-02'><a/>
</div>

#st-01 { background-color: red }
#st-02 { font-weight: bold }

Answer 1

不完全是您正在寻找的内容，但如果您不介意复制和粘贴HTML，请尝试此操作。没有太多的功能，但它做的工作！

http://extractcss.com/

https://github.com/peterlazzarino/Inline-CSS-Extractor

Answer 2

您可以使用一些JS / JQuery代码来提取样式，清除它们，为元素提供ID并添加css。检查此示例，您可以进一步扩展它。

$(document).ready(function(){
    var i = 0;
    var css = "";
    $("div,a").each(function(){
        $(this).attr("id","st-"+i);
        css += "#"+$(this).attr("id")+"{"+$(this).attr("style")+"}";
        $(this).removeAttr("style");
        i++;
    });
    $("style").html(css);
});

http://jsfiddle.net/d8TaJ/

从html文档中提取css样式到外部css文件

2 个答案: