html - 如何开始为给定的(动态生成的)HTML 创建 CSS？

Question

布局和内容的分离ion 是 CSS 和 HTML 的领域 - 到目前为止都很好理解。现在关于分离ing...

我正在寻找提示和最佳实践，以开始为内容管理系统提供“皮肤”或“主题”的任务。

背景:

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

到目前为止，我们的设计师主要是完全控制 HTML 和 CSS，调整其中任何一个以获得像素完美的布局。随着 cms 的采用，有很多预先创建的 HTML(非常语义化，几乎没有表格 :) 需要使用 CSS 和图像进行换肤。尽管可以更改 HTML 片段，但我宁愿仅在万不得已时才这样做。

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

将动态生成的页面保存到磁盘并在本地进行更改似乎是一种不好的做法。这对于 CSS 文件来说是可以的，但是对 HTML 元素的更改必须修改到生成它们的片段中。如果可能的话，我想将其排除在设计师的领域之外。此外，Dreamweaver(或任何类似工具)对 HTML 结构进行隐式调整的想法让我感到恐惧。

出于好奇:提到的 CMS/Portalserver 是 Liferay ，但这个问题实际上与语言和工具无关。

编辑:FireBug(正如 Josh 所建议的那样)非常适合尝试对 css 进行即时更改。是否还有更多 - 无论是在工具领域还是在过程中和自组织领域？

Answer 1

如果您正在寻找分离样式和内容的实际示例，那么我建议您使用 CSS Zen Garden .浏览 HTML 和 CSS 具有启发性和启发性，应该对您尝试做的事情有所帮助。

我的第一个建议是让一切尽可能语义化，并使用大量类和 ID 来 Hook 您的样式。