Question

我设计了网站：http://piratesofpopulous.comli.com/ 而且我还在努力，但是有一个问题，我的网站似乎并没有为所有浏览器设计相同的设计，在Chrom和Mozilla中，你可以看到几个方面的半径，但在IE中它没有显示和布局完全搞砸了，你能告诉我如何修复它。

我的“border-radius and margin”在IE中没有正确显示，无论如何都要在IE中执行吗？我没有在PHP和HTML中定义doc类型，这可能是个问题吗？

此外，我的所有网页都是 * .php格式。他们有HTML但扩展名为.PHP，那么，我是否需要为IE支持定义doc类型和一些其他border-radius属性？

请帮助，或者我的部落成员不会加入我的网站。

Answer 1

首先，您询问doctype是否重要，答案是非常大的。

将以下行添加到HTML代码的最顶部（<html>标记上方）：

<!DOCTYPE html>

这应该有助于边距和其他奇怪的布局问题。如果没有doctype，IE会进入“quirks模式”，这是一种非常古老的模式，与所有其他浏览器的工作方式不同。

如果您使用的是IE9，它也可能有助于解决border-radius和box-shadow问题：IE9确实支持这些功能，但可能不支持怪异模式。

如果您使用的是IE8或更早版本，则浏览器根本不支持border-radius或box-shadow。我的建议是让没有这些功能的Ie8用户生活;您的网站可能看起来不太好，但它可以使用，并且可能会鼓励他们升级浏览器。

如果您真的想在IE8中支持这些功能，可以使用名为CSS3Pie的脚本向IE添加border-radius和box-shadow功能。单击该链接进行下载，然后按照说明在您的站点上进行设置。是否值得努力使IE8看起来很好取决于你。

希望有所帮助。

Answer 2

我认为你的部分问题是你在css中缺少这样的东西来支持浏览器部落。

-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 0 6px rgba(0,0,0,0.3);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
-webkit-background-clip: padding-box;
-moz-background-clip: padding-box;

跨网站的跨浏览器/平台支持

2 个答案: