HTML "clean-up"服务：将内联样式属性转换为 CSS 规则

Question

我想知道是否有一种服务可以"清理"html代码，以便将所有内联style="属性转换为css规则，并用相应的class="属性替换。例如，我想从这段代码（文件"test.html"）中获得：

<!-- test.html -->
<div style="width:600px;margin:auto;padding:10px 0px 10px;cursor:pointer;color:#336699;font-style:italic;font-size:18px;" 
              onClick="toggleText('addmessage')">
    <span style="border-bottom:1px dotted #336699;">
Add message</span>
</div>
<div id="addmessage" style="width:600px; margin:auto;padding:10px 0px 10px;display:none;">
... etc.

像这样的东西：

<!-- test.html -->
<div class="class_1" 
              onClick="toggleText('addmessage')">
    <span class="class_3">
        Add message</span>
</div>
<div id="addmessage" class="class_2">
... etc.

加css文件：

<!-- style.css -->
.class_1, .class_2 
{
    width:600px;
    margin:auto;
    padding:10px 0px 10px;
}
.class_1 
{
    cursor:pointer;
    color:#336699;
    font-style:italic;
    font-size:18px;
}
.class_2
{
    display:none;
}
class_3
{
    border-bottom:1px dotted #336699;
} 

Answer 1

http://www.tinytool.net/96002/inline_css_extractor