目前我正在设计一个网站，我发现很难在所有浏览器上显示网站。
是否有任何规则，建议等可供使用？
由于
答案 0 :(得分：26)
目前，最受欢迎的大多数兼容浏览器是Firefox，因此向Firefox开发是自然的第一步。使用W3C的验证器确保您正常运行。一旦你的网页大部分完成，请确认它在Safari和Chrome中看起来仍然很好（同时也是高度兼容的浏览器，所以你不应该有太多麻烦），然后开始为IE修复它（6 和< / strong> 7）。相信我，它需要修复！当需要添加例外时，像QuirksMode这样的网站可以提供很大的帮助。
由于XHTML有许多支持者，这可能会成为争议点之一。不幸的是，以IE兼容和符合标准的方式提供XHTML文件是不可能的 - IE将无法识别XHTML MIME类型，并且违反了将它们作为text/html提供的标准。只有HTML 4.01 Strict DOCTYPE才能将所有浏览器置于（接近）标准模式，同时仍然符合标准。有关详情，请查看DOCTYPE switching。如果您在没有编写格式良好的XML的页面的情况下绝对无法使用，请使用XSL Transformation将您的页面从您选择的XML风格转换为HTML。
它们有时很诱人，但黑客是基于浏览器错误的副作用。因此，很难预测未来的浏览器将如何对它们作出反应。另一方面，条件注释是IE浏览器的有意功能，因此可以安全使用。事实上，它们是将IE特定（通常是非验证）CSS保留在有效样式表之外的绝佳方式。
尝试让所有浏览器排队，到像素是一种令人沮丧的练习（并且通常是徒劳的）。尝试创建在破坏时仍然看起来不错的布局，因为更容易修复两个左手边框之间的错位，而不是在页面两侧的左侧和右侧之间！使用具有内置边框的背景图像应该是大警告标志！
并非所有人都使用与您相同尺寸的显示器;而不是设置font-size: 10px;的脚注，将其设置为font-size: smaller;或font-size: 80%;。这是一个很大的acessibility问题。
您永远不知道所有浏览器是否都使用相同的默认值。 YUI's "reset" stylesheet是一个很好的起点。
答案 1 :(得分：23)
几乎不可能让网站在所有浏览器和平台上看起来完全一样。第一个原因是在Windows，Mac，Linux，Solaris等上呈现的字体不同。
我们遵循一个新的想法：网站不必在不同的浏览器和平台上看起来完全相同。你可以很容易地把它带到96-98％的路上。其余的会为你带来过多的努力以获得潜在的收益。
我们开始为Firefox开发。如果我们得到那个，那么其余的浏览器非常接近。在大多数情况下，IE是一个非常棘手的问题。我建议你告诉你的客户或你自己IE 6不再是一个要求了。
确保使用“重置”css样式表从右脚开始，将所有浏览器输出放在同一个地面上。查看：http://developer.yahoo.com/yui/reset/
最后，为自己省去一些麻烦，并在像ExtJS或JQuery或Prototype这样的Javascript库上进行标准化，这将隐藏浏览器的差异，让您专注于项目的代码。
答案 2 :(得分：12)
答案 3 :(得分：10)
结帐Browsershots。它使用各种浏览器制作您网站的屏幕截图，因此您可以直观地检查它。它有点慢但它对我有用。
答案 4 :(得分：5)
以下是我刚才提到的关于在浏览器中完善网站的答案（来自here）
实际上，开发Web应用程序时需要使用的是：
我的意思是你应该在所有3个主要的A级浏览器上测试你网站的每一步 ...所以如果某些东西在这个过程中不起作用，你就会确切地知道是什么原因造成的。
如果您没有定期查看浏览器的页面结果，那么以后修复问题会更加困难。
答案 5 :(得分：4)
许多开发人员喜欢开始使用FireFox进行测试并转到IE7。这样他们就拥有了最受欢迎的浏览器。
我喜欢从IE7开始，而不是去FireFox，因为Firefox有这个FireBug让我看到了什么错误并进行了修正。但我不得不说，我正在慢慢改变以使用FireFox拳头进行测试，因为它确实尊重所有规则。 （顺便说一下，FireBug在Javascript for IE中可用，所以很棒）。
当然，你应该看看谁是你的公众。如果它是公司内部使用的，他们只使用IE ...选择很简单。如果对于开发人员来说更多，那么您将拥有更多将使用FireFox的用户...您可能希望首先根据您的受众进行测试。
但是，不要试图让它在所有浏览器上看起来都很完美，你会浪费你的时间。只需确保一切正常，所有javascript操作都已正确完成。
答案 6 :(得分：4)
我建议您确定目标受众，然后确定他们使用的浏览器。完成此操作后，在该浏览器中追求完美。现在，您可以做一些解决方案，使其对其他浏览器看起来很好。
今天所有浏览器的完美目标与要求世界和平相似。
你可以采取的另一种方法是使用像jQuery这样的Javascript框架来缓解痛苦。
答案 7 :(得分：3)
我发现使用更多的CSS而不是表格可以更容易地在所有浏览器上使用它。它仍然有点棘手，但表格布局逻辑更糟糕。谨慎使用表格。
哦，让事情变得“有弹性”总是一个问题。固定的宽度/高度更容易。
答案 8 :(得分：3)
答案 9 :(得分：3)
不要试图让每个浏览器像其他浏览器一样显示像素完美...只有你会知道！试着让它在每个浏览器上看起来都很好。
答案 10 :(得分：3)
使用严格的doctype。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
如果您使用的是ASP.NET，那么您应该添加/更改这是您的web.config。
<system.web>
<xhtmlConformance mode="Strict"/>
您还应该查看符合css的适配器。 http://www.asp.net/cssadapters/
我花了好几个小时让我的website显示在所有浏览器中显示相同，这似乎有效。最后一个建议。经常检查：在检查之前不要做太多，以确保所有浏览器都显示相同的内容。
答案 11 :(得分：2)
为Firefox开发。然后应用特定于IE的修复程序。希望它能在Chrome和Safari中呈现。
原因是有一些修复程序可以使IE“正常”工作，但并不是很多让Firefox表现不佳。
哦，并购买Transcending CSS的副本。
答案 12 :(得分：2)
我的方法是为firefox，opera和其他非Microsoft浏览器编写代码。一旦它适用于那些，我在单独的样式表/ js文件中修补IE功能。
此外，我通常使用JS库和CSS框架。 10次中有9次使用Jquery和YUI网格。
答案 13 :(得分：1)
使用JS库，例如ExtJS。这抽象出了样式的浏览器特定方面。
只要它清晰易读，它在不同的浏览器中看起来是不一样的吗？
答案 14 :(得分：1)
对于firefox使用CSSViewer Extension，它可以帮助您查看一些非常用户友好的代码修复。 使用CSS显示：阻止或显示：内联块属性，它们非常有用。 边距，填充，高度和宽度将是您的朋友，有时您需要指定这些值以在许多浏览器上看到相同的内容。 对于字体，我建议你阅读yahoo yui fonts css stuff。
答案 15 :(得分：1)
好的，最好的方法是使用库和预先编写的代码。例如：永远不要使用JavaScript，而是使用JQuery，因为它与所有浏览器兼容，而不是编写自己的主题，使用免费的CSS主题。
这对我有用，帮助我节省大量时间。因为在专业市场上，时间意味着金钱。
感谢。
答案 16 :(得分：0)
使用严格的doctype，有效的xhtml / html和有效的CSS是很好的起点。另外，请确保使用reset / undo.css。
尽管有这些，但是会有捕获但很少但是
答案 17 :(得分：0)
我首先检查FF等网站，然后“修复”网站在IE中看起来不错。大多数情况下，如果代码经过验证且干净简单，IE只需要很少的小编辑。我为IE使用不同的样式表。我不建议使用hacks。对于javascript只使用一个库。 是的，浏览器有很多帮助。
答案 18 :(得分：0)
IE7也不再是必需品。它现在是一个令人不安的安全责任。 IE8应该支持其他浏览器的大多数功能，而它不支持的功能并不重要。体验会降低，但如果你首先使用的是IE，那么你无论如何都没有品味。