【问题标题】:HTML5 `<link rel="shortcut icon" />`HTML5 `<link rel="shortcut icon" />`
【发布时间】:2012-10-24 01:19:18
【问题描述】:

HTML5 的WHATWG document 表示rel 属性必须包含以空格分隔的值,然后它会给出一个允许值的表格。

属性的值必须是一组以空格分隔的标记。 allowed keywords and their meanings...

link 元素的允许关键字列表不包括shortcut,但包括icon。所以我在看众所周知的标签

<link rel="shortcut icon" href="/favicon.ico" />

想知道它是否符合 HTML5 标准。我应该从整个网站的这个标签中删除关键字shortcut 吗?

【问题讨论】:

    标签: html favicon rel


    【解决方案1】:

    来自同一个 WHATWG 文档:

    由于历史原因,icon 关键字前面可能有 关键字“快捷方式”。如果存在“shortcut”关键字,则它必须是 紧接在 icon 关键字之前,并且这两个关键字必须是 仅由一个 U+0020 空格字符分隔。

    【讨论】:

    • 但是如果我想继续前进,删除shortcut 是否安全?
    • 未来的主流浏览器都不太可能需要它,如果你是这个意思的话。
    • @TestSubject:是的,你应该可以直接使用icon
    【解决方案2】:

    更新: 根据这个页面https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types

    快捷方式链接类型经常出现在图标之前,但是这种链接类型 是不合格的,被忽略,网络作者不得再使用它。

    另外,我在 W3Schools 文档中没有看到任何对 shortcut 的引用,所以我认为最好将其省略。 https://www.w3schools.com/tags/att_link_rel.asp

    【讨论】:

    • w3schools != W3C
    • @pablo 也许您可能想编辑您的答案以改进您的参考资料?也许只是删除对 w3schools 的引用?你可能会得到更多的支持。
    【解决方案3】:

    虽然它仍处于实验阶段(因为 HTML5 开发正在进行中),但 w3.org HTML5 Markup Validator 是一个很好的在线工具,您可以查看。大约 6 个月前,我广泛使用了它,它总是返回准确的 HTML5 语法报告。

    【讨论】:

    • 我发现这个答案中的标记验证器很有用。截至 2020 年 12 月 11 日,它可以正常工作,并且在向我显示所有类型的警告和错误方面做得很好。然而它并没有将以下行标记为警告或错误: 也许这个信息会更好对帖子的评论而不是答案。
    【解决方案4】:

    我已经在 Google Chrome、Mozilla Firefox、Internet Explorer 和 Microsoft Edge 上测试过这段代码,唯一不工作的浏览器是 Edge。从硬盘前 c:\temp\test.html

    上制作的页面添加收藏夹时
    <html>
    <head>
    <meta http-equiv="expires" content="0"><!-- Never caches the page -->
    <link id="favicon" rel="shortcut icon" href="icon_32.ico">
    </head>
    <body>
    ...
    </body>
    </html>
    

    【讨论】:

    • 您对测试结果的回答非常好 - 您可以通过在测试信息中添加更多信息来改进它:浏览器版本、操作系统,也许还有每个浏览器的浏览器选项卡的图像您进行了测试以显示结果?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-10-02
    • 1970-01-01
    • 2020-06-17
    • 1970-01-01
    • 2013-10-16
    相关资源
    最近更新 更多