为什么要指定@charset";“UTF-8”;;在你的CSS文件中?

为什么要指定@charset";“UTF-8”;;在你的CSS文件中?,css,character-encoding,Css,Character Encoding,我一直将此说明视为已移交给我的众多CSS文件的第一行: @charset "UTF-8"; 它是做什么的,这在规则中是必要的吗 另外,如果我在我的“head”元素中包含这个meta标记,那么是否就不需要在CSS文件中也包含它了 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 它告诉浏览器将css文件读取为UTF-8。如果您的CSS包含unicode字符,而不仅仅是ASCII字符,这将非常方便 在

我一直将此说明视为已移交给我的众多CSS文件的第一行:

@charset "UTF-8";
它是做什么的,这在规则中是必要的吗

另外,如果我在我的“head”元素中包含这个meta标记,那么是否就不需要在CSS文件中也包含它了

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

它告诉浏览器将css文件读取为UTF-8。如果您的CSS包含unicode字符,而不仅仅是ASCII字符,这将非常方便

在meta标记中使用它是可以的,但只适用于包含该meta标记的页面


在for CSS 2上阅读CSS文件的字符集解析规则。

这在没有按照HTTP头或其他元数据(例如本地文件系统)进行编码的情况下非常有用

设想以下样式表:

[rel="external"]::after
{
    content: ' ↗';
}
如果读取器将文件保存到硬盘上,而您忽略了
@charset
规则,大多数浏览器将使用操作系统的区域设置编码(例如Windows-1252)读取文件,并插入–†-而不是箭头

不幸的是,您不能依赖此机制,因为支持非常…罕见。 请记住,在网络上,HTTP头将始终覆盖
@charset
规则

确定样式表字符集的正确规则按优先级顺序排列:

  • HTTP字符集头
  • 字节顺序标记
  • 第一条
    @charset
    规则
  • UTF-8 最后一条规则最弱,在某些浏览器中会失败。
    中的
    字符集
    属性在中已过时。
    注意不同声明之间的冲突。它们不容易调试

    推荐阅读
    • 罗斯罗尔夫:
    • IANA:-不允许使用其他名称;如果为同一编码注册了多个名称,请使用
      @charset
      的首选名称
    • MDN:。有一个支撑台。我不相信这一点
    • 来自CSS工作组

    在每个包含文本的页面上始终包含字符集规范的一个原因是为了避免跨站点脚本漏洞。在大多数情况下,UTF-8字符集是文本(包括HTML页面)的最佳选择。

    如果在css文件中添加标记,则说明您做错了。标记属于您的html文件,并告诉浏览器html是如何编码的,它没有说明任何关于css的内容,css是一个单独的文件。你可以想象你的html和css有完全不同的编码,尽管我不能想象这是个好主意。

    你的意思是css文件需要使用
    内容类型:text/css;charset=utf-8
    header?@Pacerier是的,如果这是HTML文件的编码(应该是)。我的意思是,它不是已经暗示没有charset,css文件的字符集应解释为与嵌入HTML文件的字符集相同?@Pacerier我观察到情况并非总是如此。如果从非UTF-8站点链接这些文件,也很重要,例如,比如:一个编码为UTF-16的日本网站试图从CDN加载CSS,如果CSS文件没有声明其编码,那么它将获得不可读的内容。