css - Automatic CSS Preview Generator - 有css文件，想自动生成html来预览样式

Question

我的网页设计师开发了一个相当大的 CSS 文件。

当然，其中分配了大量 ID、类和标记属性。是否有任何工具可以根据 CSS 源文件自动生成 HTML？

例如:

#basicInfoHead{
    background:url(../images/leftHeaders.jpg) no-repeat;
    margin-left: 0px;
    width:185px;
    height:28px;
}

#basicInfoHead span{
    float: left;    
}

会产生

<div id=basicInfoHead><span>#basicInfoHead span</span></div>

等等等等。从那里，我可以在我的浏览器中预览生成的代码，并查看每个单独(主要是文本)样式的外观。

提前致谢!

Answer 1

这听起来并不适用于真实世界的样式表。您的示例足够简单(即使它必须是 div#basicInfoHead 才能让任何生成器知道要生成什么)但是如果它变得更复杂怎么办？对于多个页面以不同的方式定义的元素呢？那些需要位于元素 x 之上的元素，或者需要紧跟在元素 y 之后才能看起来不错的元素呢？ “不完整”的类(class)怎么样？对于 <table><tr><th>没有为 tr 定义任何内容的系列？组合类的具体规则呢.class1.class2.class3 ？

在我一直在处理的样式表列表中，没有一个像您正在寻找的那样可以通过生成器转换为合理的 HTML 代码。不确定是否存在这样的工具。

您的设计师应该为您提供 HTML 以测试 CSS。这是通常的方式，据我所知，这是唯一真正有意义的方式。