如何为非设计师生成 CSS 标记答案

【问题标题】：How to generate CSS markup for non-designers如何为非设计师生成 CSS 标记
【发布时间】：2010-10-17 10:20:52
【问题描述】：

好的，

我的任务是将工作中的网站从基于表格的布局移植/转换/升级为基于 CSS 的布局。该站点非常典型，它有一个页眉、导航栏（页眉宽度）、左栏、主栏，然后是页脚。

一个问题是我们的企业网络标准是 IE6。传闻我们将很快部署 IE7，但目前，IE6 是我的目标。我使用 Firefox，但我的用户不使用，因此无济于事。

我昨天确实在网上找到了SuperPreview，这对我有很大帮助，但坦率地说，我不太擅长 CSS，这让我很沮丧。我必须编写/生成适用于 IE6 的标记，希望也适用于 IE7 和 IE8，但 IE6 是我的基准。

是否有工具可以帮助我，或者让我参与其中？我只需要一个可以为我生成一些布局的工具，比如 Word 中的日历向导。

我知道这是一项艰巨的任务，有什么建议吗？

附言为了让您了解这个网站的年代，它是用 ASP 3 或 Classic ASP 编写的。

已编辑。

【问题讨论】：

superpreview 听起来很酷，但是当我阅读 [当前] 已知问题时我笑了 - 包括“使用 JavaScript 的页面无法准确预览”和“大于 100 MB 的组合可能无法完全显示”。

【解决方案1】：

您可以尝试使用 Yui 布局。
多种口味可供选择。
Yahoo! UI Library: Grids CSS

【讨论】：

【解决方案2】：

确保使用不会让浏览器进入怪异模式的正确文档类型，并学习 CSS。如果您不了解 CSS 并且没有时间学习它，请将 CSS 留给了解它的人。

【讨论】：

@svinto，我同意你的看法，但是，我被选中这样做是因为我对 CSS 有基本的了解并且对它最有耐心。我只是不知道 IE6 中只有一个 CSS 错误才能提高效率
Chris：如果你的代码很简单，那么错误就不多。只需使用适当的 doctype，当出现奇怪的情况时，添加一个 position:relative。如果还不行，就买《CSS Mastery》这本书，很薄而且非常非常好。
Chris：另外请注意，大约 99% 的抱怨 IE6 的人使用了错误的文档类型，从而使 IE 进入了怪异模式，例如。像 IE 4 一样工作。

【解决方案3】：

我会寻找具有现成布局的网站。 http://blog.html.it/layoutgala/ 之类的网站。这里还有一个与 CSS 布局相关的问题。 CSS 布局对于初学者来说可能非常棘手，而且很难想出。甚至专家也使用现成的经过测试的布局作为构建网站的基础。

我还想推荐一个好的编辑器来构建网站。 Dreamweaver 似乎很受欢迎，但我更喜欢免费的 Aptana，因为我一直想用代码“弄脏我的手”，以获得掌控一切的感觉。

此外，不要再认为 ie6 是你的目标，它会引导你为 ie 开发，这会导致你遇到问题。我强烈建议在 firebug 的帮助下使用 Firefox 进行开发。然后解决 ie6 带来的错误和问题。

这样你以后会过得更好。当更改为 ie7 或更改为 safari、chrome、firefox、opera 或除了 ie 之外的任何其他内容时，您的网站将运行得更好。 :)

【讨论】：

【解决方案4】：

如果您觉得有点喜欢冒险，您可以尝试学习the grid systems 之一。

这就是它为您提供的东西

Blueprint 是一个 CSS 框架，它旨在减少您的发展时间。它给你一个坚实的基础在上面构建您的项目，使用一个易于使用的网格，明智的排版，有用的插件，甚至打印样式表

你也可以试试http://layouts.ironmyers.com/这样的网站

【讨论】：