Answers:
哇，有人刚刚在SO上发布了此消息。
这正是医生的命令：http : //jsfiddle.net/
您可以编写html，css和javascript，然后直接在其中运行！！另外，他们已经引用了Jquery和其他东西！
我认为Internet规则33是您想要/想象它的地方！;）
我只是偶然发现http://colorschemedesigner.com/。
这非常适合选择颜色，并且将向您显示示例页面，以查看应用于典型页面的配色方案。
更新：网站现在为http://paletton.com
我什么都不知道，但这很容易设置。只需使用您描述的所有元素创建一个基本的HTML文档。（如果需要，您可以从Lipsum.com生成文本。）然后链接到文档头中的CSS文件，以查看附带的样式。下次要测试时，将其更改为指向另一个CSS文件。
并非完全符合您的要求，但是我喜欢less.js的实时监视模式。
通常，我只是手动模拟任何需要HTML或XHTML风格的元素/组合，但是您可以创建自己的元素主文档。如果插入第二个监视器（或两个，三个等）以打开（或使用第二台计算机）所有浏览器，则您保存的所有更改将立即应用于所有这些浏览器。
LessCSS语法可以与普通CSS一起使用，但是使用起来更快，更容易提取（之后可以将结果转换为普通CSS）。
诸如Aviary之类的工具使您可以轻松拍摄屏幕快照（包括自动向下滚动和拼接），可以快速注释（与共享链接在线）或在另一个工具（如Photoshop，GIMP，Paint .NET等），方法是将它们覆盖为一层，并更改其顶部的透明度。
编辑：
如果要自动化屏幕截图过程（保存文件时），以便：
那么您可以在屏幕抓取器中使用类似文件观察器（请原谅Python方向，还有许多其他解决方案）之类的东西。后期处理也可以自动化，如果您使用一致的窗口位置（程序/桌面环境可以帮助完成此任务），浏览器周围的“镶边”可以作为脚本的一部分切掉。
w3schools使您可以使用HTML和CSS规则。只需找到您要使用的CSS / HTML，然后查找显示为“亲自尝试”的位置即可。这是他们的border CSS页面，这是他们的游乐场。
我在html / css中构建所有页面，然后使用firebug或chrome网站管理员工具添加/更改/使用样式进行实验。它快速，简单和临时，非常适合实验。另外，您可以在自己的服务器上使用自己的代码，这是另一个好处。
Buzzkill：我的UI Developer部分提醒您，最好使用真正的设计工具进行概念设计，然后根据浏览器的差异进行编码以模仿。
旁注-我是Jquery的UI Themeroller的忠实粉丝。这样的工具确实可以让Themeroller在侧面更改样式。可以通过Themeroller的CSS对网站进行完全主题化，然后在不同主题之间进行切换。如果您从未尝试过，它确实可以加快部署速度，尤其是当您正在寻找现在非常流行的“光滑”外观时。
不确定是否是您要的，但是CSS Zen Garden的HTML页面包含大量CSS设计。您可以为此站点编写自己的CSS，这些示例非常有启发性。