<link> 标签上的 TITLE 属性导致样式表中断?
Style sheets break with TITLE attribute on <link> tags?
我正在帮助升级非常旧的公司内部网。我们的用户使用 IE8 和 IE9。我们的大多数网站都是为在 IE5 - IE9 中工作而编写的。
我们即将让每个人都升级到 IE11,并且试点发现了大量的兼容性问题。未来几个月将进行大量补救,并明智地使用企业模式、兼容模式、X-UA 标签等。
但是我遇到了一个没有任何意义的奇怪问题。这似乎是一个错误,但是:
- 它发生在 IE11 边缘模式、Chrome 和 Firefox 中。
- 我在服务器 运行 IIS 6 和 IIS 7.5 上重复了这个问题,因为
以及我的桌面。
- 适用于 .asp、.htm 和 .aspx 文件类型。
这是问题所在:
如果您的网页有两个链接样式 sheet,并且两个标签都有 title
属性,则不会应用第二个样式 sheet 中定义的样式,除非(a) 标题属性完全匹配,或者 (b) 其中一个标题属性为空。
例如:
如果您的 <link>
标签具有相同的 title
属性,则一切正常:
<link REL="stylesheet" HREF="a.css" TYPE="text/css" TITLE="1">
<link REL="stylesheet" HREF="b.css" TYPE="text/css" TITLE="1">
如果 title
属性之一为空,则一切正常:
<link REL="stylesheet" HREF="a.css" TYPE="text/css" TITLE="1">
<link REL="stylesheet" HREF="b.css" TYPE="text/css" TITLE="">
如果其中一个标签没有 TITLE 属性,则一切正常:
<link REL="stylesheet" HREF="a.css" TYPE="text/css" TITLE="1">
<link REL="stylesheet" HREF="b.css" TYPE="text/css">
但是……如果您在 title
属性中有不同的值,则不会应用第二种样式 sheet。
<link REL="stylesheet" HREF="a.css" TYPE="text/css" TITLE="1">
<link REL="stylesheet" HREF="b.css" TYPE="text/css" TITLE="2">
我已经接受了这样一个事实,即我们将不得不扫描我们 Intranet 上的每一页,寻找带有附加到 <link>
标签的 title
属性的页面,但我真的想了解为什么会这样。最有趣的是,这种情况在我尝试过的每个现代浏览器中都会发生。如果您强制 IE11 进入企业模式或兼容视图,问题就会消失。
除了从 <link>
标签中删除 title
属性之外,谁能解释发生了什么,或者提出解决方案?
这似乎是预期的行为。例如,来自 MDN docs
A preferred stylesheet [...] is one that has a value of stylesheet
supplied for the rel
attribute, and any value at all for the title
attribute. Here are two examples:
<link type="text/css" rel="stylesheet" title="Basic styles" href="basic.css" />
<link type="text/css" rel="stylesheet" title="Fish and boats" href="ocean.css" />
According to the HTML 4.01 specification, only one of the preferred stylesheets can be used at a time. Therefore, given the above example, only one of the two preferred stylesheets will be applied to the document. The specification does not supply a procedure to decide which one should be used, so user agents are free to make whatever choice they like.
来自the spec
The title attribute gives the title of the link. With one exception, it is purely advisory. The value is text. The exception is for style sheet links, where the title attribute defines alternative style sheet sets.
浏览器可以(我不知道还有什么可以做的,但是 extensions 可用)提供 UI 允许用户在作者提供的不同样式表之间切换一页。
title 属性用于对样式表进行分组以供选择(并为它们提供标签)。
遇到的第一个样式表将用于确定默认使用哪个组。
我正在帮助升级非常旧的公司内部网。我们的用户使用 IE8 和 IE9。我们的大多数网站都是为在 IE5 - IE9 中工作而编写的。
我们即将让每个人都升级到 IE11,并且试点发现了大量的兼容性问题。未来几个月将进行大量补救,并明智地使用企业模式、兼容模式、X-UA 标签等。
但是我遇到了一个没有任何意义的奇怪问题。这似乎是一个错误,但是:
- 它发生在 IE11 边缘模式、Chrome 和 Firefox 中。
- 我在服务器 运行 IIS 6 和 IIS 7.5 上重复了这个问题,因为 以及我的桌面。
- 适用于 .asp、.htm 和 .aspx 文件类型。
这是问题所在:
如果您的网页有两个链接样式 sheet,并且两个标签都有 title
属性,则不会应用第二个样式 sheet 中定义的样式,除非(a) 标题属性完全匹配,或者 (b) 其中一个标题属性为空。
例如:
如果您的 <link>
标签具有相同的 title
属性,则一切正常:
<link REL="stylesheet" HREF="a.css" TYPE="text/css" TITLE="1">
<link REL="stylesheet" HREF="b.css" TYPE="text/css" TITLE="1">
如果 title
属性之一为空,则一切正常:
<link REL="stylesheet" HREF="a.css" TYPE="text/css" TITLE="1">
<link REL="stylesheet" HREF="b.css" TYPE="text/css" TITLE="">
如果其中一个标签没有 TITLE 属性,则一切正常:
<link REL="stylesheet" HREF="a.css" TYPE="text/css" TITLE="1">
<link REL="stylesheet" HREF="b.css" TYPE="text/css">
但是……如果您在 title
属性中有不同的值,则不会应用第二种样式 sheet。
<link REL="stylesheet" HREF="a.css" TYPE="text/css" TITLE="1">
<link REL="stylesheet" HREF="b.css" TYPE="text/css" TITLE="2">
我已经接受了这样一个事实,即我们将不得不扫描我们 Intranet 上的每一页,寻找带有附加到 <link>
标签的 title
属性的页面,但我真的想了解为什么会这样。最有趣的是,这种情况在我尝试过的每个现代浏览器中都会发生。如果您强制 IE11 进入企业模式或兼容视图,问题就会消失。
除了从 <link>
标签中删除 title
属性之外,谁能解释发生了什么,或者提出解决方案?
这似乎是预期的行为。例如,来自 MDN docs
A preferred stylesheet [...] is one that has a value of
stylesheet
supplied for therel
attribute, and any value at all for thetitle
attribute. Here are two examples:<link type="text/css" rel="stylesheet" title="Basic styles" href="basic.css" /> <link type="text/css" rel="stylesheet" title="Fish and boats" href="ocean.css" />
According to the HTML 4.01 specification, only one of the preferred stylesheets can be used at a time. Therefore, given the above example, only one of the two preferred stylesheets will be applied to the document. The specification does not supply a procedure to decide which one should be used, so user agents are free to make whatever choice they like.
来自the spec
The title attribute gives the title of the link. With one exception, it is purely advisory. The value is text. The exception is for style sheet links, where the title attribute defines alternative style sheet sets.
浏览器可以(我不知道还有什么可以做的,但是 extensions 可用)提供 UI 允许用户在作者提供的不同样式表之间切换一页。
title 属性用于对样式表进行分组以供选择(并为它们提供标签)。
遇到的第一个样式表将用于确定默认使用哪个组。