如何开始为给定的（动态生成的）HTML创建CSS？

布局和内容的分离是CSS和HTML的领域——到目前为止，人们已经很好地理解了这一点。现在关于分离

我正在寻找为内容管理系统提供“外观”或“主题”的提示和最佳实践

背景： 我们开始采用门户服务器/内容管理系统，并开始改变外观以满足我们的需要

到目前为止，我们的设计师主要是完全控制HTML和CSS，调整其中任何一个以获得完美的像素布局。随着cms的采用，有很多预先创建的HTML（非常语义，几乎没有表格：）需要使用CSS和图像进行蒙皮。虽然可以更改HTML片段，但我更愿意这样做，只是作为最后的手段

由于这提供了“如何开始”的挑战，我的问题是关于任何TIPP如何继续或有助于管理或组织此任务的文章，例如设计中的最佳实践、如何分割此任务或使用什么工具

将动态生成的页面保存到磁盘并在本地进行更改似乎是不好的做法。这对于CSS文件来说是可以的，但是对HTML元素的更改必须根据它们生成的片段进行改装。如果可能的话，我想把它排除在设计师的范围之外。此外，Dreamweaver（或任何类似工具）对HTML结构进行隐式调整的想法对我来说是可怕的

好奇的是：提到的CMS/Portalserver是，但问题是语言和工具不可知

---

编辑：FireBug（正如Josh所建议的）非常适合尝试动态更改css。还有更多吗？无论是在工具领域还是在过程和自组织领域？

通常，每当我遇到这样的情况时，我都会在FireFox中打开页面，使用FireBug检查不同的元素，并查看css应用于它们的具体内容。然后我会修改现有的css，直到得到我喜欢的。你甚至可以在firebug中玩游戏，修改CSS而不“保存”这些更改。

如果你想寻找分离样式和内容的实际例子，那么我建议。浏览HTML和CSS是鼓舞人心和启发性的，应该有助于您的工作

---

我的#1小贴士是尽可能使所有内容都具有语义，并使用大量的类和ID来连接样式。

看看，我们通常使用它来清理CSS并重新组织开发和生产。然而，我个人更喜欢在使用之前手工编写HTML/CSS。我想这只是个人偏好的问题。

谢谢你的回答-我们也是这样开始的，感觉有点“黑客”。但我真的很喜欢Firebug的这个功能…太棒了。我知道CSS禅园，但只是作为CSS力量的例子。我从来没有注意到“CSS资源”链接指向“Zen Garden编码和设计过程撰写”，这正是我想要的。你让我又看了一遍-非常感谢。据我所知，Liferay构建脚本将在我们的css上执行一些打包魔术，但我将为其他项目保留对css的整洁引用。知道CSS可能会被打包并不能帮助编写它。无论如何，非常感谢你的回答。