3

有人可以详细描述将title属性添加到我的 HTML 页面<link>中的样式表标记时的用途吗？<head>今天在玩一些 HTML 并<link>使用多个样式表时，我注意到我似乎在滥用title我的 s.properties 中的属性<link>。

这是我的html：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <!-- styles -->
        <link rel="stylesheet" type="text/css" media="screen" href="/static/css/foundation.min.css" title="Foundation">
        <link rel="stylesheet" type="text/css" media="screen" href="/static/css/icomoon.css" title="IcoMoon">
    </head>
    <body>
        <h1>Welcome <span class="icon-home"></span>!</h1>
        <!-- scripts -->
        <script src="/static/js/jquery-2.1.4.min.js" charset="utf-8"></script>
        <script src="/static/js/foundation.min.js" charset="utf-8"></script>        
    </body>
</html>

当我开始工作时，我很沮丧，因为我的icomoon.css样式表没有加载。我花了一段时间才意识到title属性是问题所在。具体来说，如果我title从两个样式表中删除了该属性：

<link rel="stylesheet" type="text/css" media="screen" href="/static/css/foundation.min.css">
<link rel="stylesheet" type="text/css" media="screen" href="/static/css/icomoon.css">

或者如果我给他们同样的标题：

<link rel="stylesheet" type="text/css" media="screen" href="/static/css/foundation.min.css" title="Foundation">
<link rel="stylesheet" type="text/css" media="screen" href="/static/css/icomoon.css" title="Foundation">

我的样式正确加载。经过一番调查，我发现 Firefox 允许用户通过转到View->来选择他们看到的样式Page Style。例如，我可以制作两个样式表，一个叫做“Boring”，一个叫做“Cool”，用户可以在两种样式之间切换。

话虽如此，我仍然不确定该title属性的用途是什么？主要是因为 Chrome 和 Safari（我没有检查过 Edge 或 Internet Explorer）似乎没有像 Firefox 那样在标题样式之间切换的相同功能，因为在我看来，这应该与是否<link>的rel属性包括alternate指标。显然，给我的样式表一个漂亮的标题不仅仅是一个方便的属性。

4

1 回答 1

3

来自W3C 网站：

title属性给出了链接的标题。除了一个例外，它纯粹是建议性的。值为文本。样式表链接例外，其中title属性定义了替代样式表集。

可在MDN中找到替代样式表集的定义。显然，这是 Firefox 独有的功能。

于 2015-12-13T05:05:36.270 回答