CSS3 PIE - 在没有尾部反斜杠的情况下访问站点时,不会加载行为HTC文件

Question

当我以两种不同的方式访问使用CSS3 PIE的站点时,在一种情况下找不到HTC文件.我正在使用示例域名和路径名来说明下面的问题.是什么导致这种情况发生？

http://sampledomain.com/site < - 在IE8中不呈现圆角

http://sampledomain.com/site/ < - 渲染圆角

CSS圆角文件位于

http://sampledomain.com/site/content/css/pie.htc

该网站包含来自的CSS文件

http://cdn.cdndomain.com/path/to/content/css/rounded-corners.css

CSS:

.rounded-corners
{
    behavior: url(content/css/pie.htc);
}

Answer 1

尽管你在这个问题的其他地方发表了评论,但这实际上并不是IE中的错误; 它完全理性地处理相对路径.

出现此问题的原因是因为就URL路径而言,两个URL(即带有和不带斜杠)实际上位于不同的目录中.

• http://sampledomain.com/site- 这被视为site根目录中的文件名.

• http://sampledomain.com/site/- 这被视为site根目录中的目录,并且您正在该目录中加载默认文件.

因此,就浏览器而言,这两个URL位于不同的目录路径中.因此,如果指定相对路径,则它将相对于每个路径中的不同路径,其中一个路径显然不会指向正确的位置.如果你有其他具有相对路径的项目,例如图像,它们也会有相同的问题,并且它将在所有浏览器中,而不仅仅是IE.(因此,我假设您在此页面上没有很多其他相对路径)

正如您已经解决的那样,快速解决方案是将其转换为绝对路径,从斜杠开始.这将确保从站点中的相同位置加载它,无论您从哪个URL加载它.

但是,这个问题暗示了一个更大的问题.行为良好的站点不应允许这两个URL有效.没有斜杠的URL应该使用斜杠重定向到URL; 它不应该简单地加载相同的内容,无论是否有斜杠.

允许两个URL加载相同的内容明显不利于您的网站的SEO.这意味着Google会将您的网站视为具有相同内容的两个网页,而这反过来又被视为您的Google排名的减号.

使用.htaccess/mod_rewrite很容易解决这个问题,理想情况下,您可以像原始CSS3Pie加载问题一样紧急解决此问题.

希望有所帮助.