代码之家 › 专栏 › 技术社区 › Andres Jaan Tack

为什么<link>标题属性会导致浏览器忽略我的样式?

link-tag title css html

Andres Jaan Tack · 技术社区 · 15 年前

以下HTML文档(连同CSS)无法在 b.css .

<!doctype html>
<html>
    <head>
        <link rel="stylesheet" media="screen" type="text/css" title="A" href="a.css" />
        <link rel="stylesheet" media="screen" type="text/css" title="B" href="b.css" />
    </head>
    <body>
        <div id="A">A</div>
        <div id="B">B</div>
    </body>
</html>

/* a.css */
div#A   { color: blue;  }
/* b.css */
div#B   { color: red;   }

使标题相同(例如两者 <link ... title="A"> 修好了,但我不知道原因,为什么要这样。标题在这里是做什么的,这是错误的?

4 回复 | 直到 9 年前

Neil Williams 15 年前

The HTML 4.0 spec states that there are three kinds of stylesheets :持久、首选和备用。

如果样式表链接到 rel="stylesheet" 而且没有 title 属性。渲染时使用所有持久性样式表。
如果样式表链接到 rel=“样式表” 并且有一个 标题 属性;具有相同属性的首选样式表 标题 分组在一起,但不能有多个组。似乎浏览器只会选择一个首选样式表来呈现,因为应该只有一个。
最后,如果样式表链接到 rel="alternate stylesheet" 并且有一个 标题 .这些样式表应该允许用户选择样式表,它们按 标题 并在浏览器的样式表选择器中显示(如果有)(在Firefox中查看>>页面样式)。每个组(按标题)互相排斥。

通过放 标题 在样式表上的属性,您无意中使它们成为首选样式表,而不是预期的持久样式表。这也是为什么他们都有相同的头衔时才工作。

Asher Dunn 15 年前

尼尔·威廉姆斯的回答:

作者可以指定 互相排斥 称为替代样式表的样式表…用户代理应该允许用户从备用样式表中进行选择。

(增加了强调)

也:

若要首选样式表,请将rel属性设置为“样式表”,并用title属性命名样式表。

这是来自 http://www.w3.org/TR/REC-html40/present/styles.html#h-14.3.1

Andreas Bonini 15 年前

阅读此: http://blogs.telerik.com/dimodimov/posts/08-05-15/title_attributes_in_css_link_tags_prevent_styles_from_being_applied.aspx

我已经意识到一段时间了在CSS中的标题属性标签会引发问题并阻止一些将CSS样式应用于网页。今天我投资了几个数小时来了解发生了,这就是我们所拥有的。

如果您在佩奇和其中一个标题属性,然后标记接下来一定有具有相同值的标题属性或完全没有标题属性,否则后一个CSS文件中的样式将不会应用于该页。

这个问题很容易在各种版本的Firefox、Opera和游猎。唯一的浏览器不表现出意想不到的行为是 Internet Explorer。

真奇怪O.O.

-1

Rolf 14 年前

我花了大约3个小时才完成,因为我添加了一个新的样式表include。我想我在当前的CSS规则和我正在添加的规则之间有一些冲突。在失去理智的选择之后,我尝试从链接中删除标题标签。我不怎么想它,认为它是一些无用的元数据。事实证明,这正是阻止CSS被解析的原因。事实证明,脑残CSS标准的陈旧委员会提出了这个问题。难道他们就不能添加一个更清晰的新属性来代替标题属性的存在或不存在吗? 我失去了所有应该投入到生产中去的时间。在搜索过程中,我向自己保证一旦找到这个问题的根源,我就会采取措施。现在,仍需决定这些措施。