在演示页面中查看css样式

Question

是否有一个应用程序将采用.css文件并输出它的演示页面？

喜欢占用所有span / div / a元素并在html页面中显示它们的样子？

Answer 1

...没有关联的（X）HTML文件？

如果您需要做的事涉及CSS而不了解其关联的（X）HTML文档的结构或类或ID ......那么编写一个小页面并在浏览器中预览它是不是很简单？

不要冒犯，但我个人认为在没有（X）HTML文档的情况下预览CSS有点奇怪。 原因如下：

如果你从CSS开始，你可能会尝试让你的CSS迎合你的CSS，而它应该是相反的方式。 从CSS开始，然后编写页面感觉就像是一个很好的方式来结束凌乱的HTML，如果我必须选择（凌乱的HTML和干净的CSS）或（干净的HTML和凌乱的CSS）我个人会选择干净的HTML每次。

您还提到了目标<div>和<span> 。 这是一个个人观点，但我非常强烈地认为人们不应该在没有class或id属性的情况下定位<div>和<span> 。 由于<div>和<span>没有语义含义，我无法想象为什么你需要设置它们的样式，除非你重置CSS或满足要求，并且你的客户更有可能要求“所有员工姓名都应加下划线“或”跨度应加下划线“？ ...但是一旦你定位了class和id，就需要你的HTML文档与你的CSS一起使用。

Answer 2

虽然这不会自动生成css中的任何内容，但这是一个出色的XHTML测试页面，其中包含您可能使用的所有标准标记，页面和表单元素。 将您的样式表应用到此页面，您将有80％的方式。 然后只需为自定义类添加区域等.http：//snipplr.com/view/8121/html-test-page-for-css-style-guide

Answer 3

TopStyle使用内部视图执行此操作。 这是一个很好的工具。

http://www.topstyle4.com/

Answer 4

试试rendur： http： //rendur.com/

我同意理查德的说法，如果你要设计原始的div和span元素，你不应该期待太多。 :)