html - 关注样式表和跨浏览器兼容性

Question

让我通过解释我在网页设计方面的背景经验来开始这个话题。我一直更像是一个后端程序员，使用 PHP 和 SQL 等等。但是，我对 HTML 和 CSS 的了解很浅。问题是，我不知道这一切。我所知道的是，当涉及到设计(而不是后端脏活)时，我了解基本的 CSS 属性，我也了解 HTML，而且我通常可以用两个和几个 DIV 标签拼凑出一个草率的网页。

无论如何..

我一直遇到的问题是，当我在IE7等浏览器中设计网站时(然后在IE7上看起来很完美)，然后在IE8或IE6或Mozilla(等)上查看它，它得到了所有空间大、丑陋，看起来与它在 IE7 上的外观完全不同。

问题一:

基本上，我想问大家的是，我应该通过什么途径来学习如何正确地建立网站？按照 CSS 标准和 HTML 标准将其构建在一起，这将使我的网站在每个浏览器上看起来都一样。 (不仅学习标准，而且我可以在哪里学习正确编写代码？)我可以用来学习这些东西的强大免费资源在哪里？

问题二:

如何正确编码我的网站？我是使用所有外部样式表来简化动态页面设计，还是将某些内容硬编码到每个页面的 DIV 标记中？什么是适当的？

哦，如果有人有任何关于如何正确设计完整布局的教程，请随意将其放在响应中的某个地方。

感谢您花时间阅读我的问题，希望您能理解我想向大家传达的信息。我需要在 Web 编程的设计方面走上正确的道路，这样我才能知道将来如何创建成功的网站。

谢谢，山姆·帕迪

Answer 1

首先，我建议不要将 IE 作为您的“开发”浏览器。比方说，从 Firefox 开始(这为您提供了 Firebug 和 web developer toolbar 等工具的优势)，然后在 IE 中正确设置。

其次，绝对是用户外部样式表；它会产生更简洁的代码和更简单的样式更新方法。绝对推荐。浏览器也可以缓存外部 CSS 文件，因此当用户在您的站点或应用程序中从一个页面转到另一个页面时，它们不会增加页面下载大小。

最后，首先使用简单的 HTML 定义您的内容，将结构基于内容的含义(通常称为“语义”HTML)，而不是您希望它的外观。使用 <ul>例如，即使您不想将其显示为“元素符号列表”(<ul> 的默认样式)，也可以标记为元素列表的内容。然后开始添加样式以使其看起来正确。这将产生非常干净的 HTML，它可以支持多种格式和布局(看看 CSS Zen Garden 了解我的意思)，还将帮助您朝着反射(reflect)内容结构的布局方向发展，这将是更易于阅读和理解。

在书籍方面，Eric Meyer 不会出错. HTML 很简单，当然，我不建议用 HTML 做一些花哨的事情，所以把你的学习精力放在 CSS 上(Eric 是 CSS 大师)。