CSS样式文件中文字符的编码问题

2015/12/20 17:20:59 人评论 次浏览 分类:CSS


在使用CSS样式文件的时候,需要使用中文字符,特别是使用字体样式的时候,比如‘微软雅黑’,’黑体‘等字体的时候会出现出现乱码的情况,这里主要是字符编码的问题。下面具体说说原因和解决方法。

原因


    浏览器会认为 CSS 文件的编码与页面一致,即 UTF-8,但 GB2312 编码下的一个中文字符是 2 个字节,在 UTF-8 编码下则为 3 个字节,在把 GB2312 编码下的“黑体”二字当作 UTF-8 编码的文字来解析的时候,得到的是“����”

    用notpad2建立的文本文档,它的默认编码格式是utf-8,用记事本打开此类中文文档是可以正常显示的,但如果把它用浏览器打开,则会出现乱码,即便是你在html文档中声明了编码是GB2312,也不行,必须把编码格式改为ANSI编码(在中文操作系统下,ANSI编码指的是中文简体)才可以。


解决


    避免乱码,我们可以这么处理,当 HTML 文件或 CSS 文件要引入一个不同编码的 CSS 文件时,要明确声明被引入的 CSS 文件的编码。 如以上的举例,在 CSS 文件的开头加上一行 @charset "GB2312"; 或者在各文件的 HTTP 响应头中声明该文件实际使用的编码。 



下面的三种方法任选其中一种或多种:
1、确保 CSS 文件和 html 文件的字符集是统一的。
2、为 CSS 文件添加字符集声明。
3、把“黑体”改为“simhei”。



另外,说明一下编码优先级,例如对于一个CSS文件,它的编码优先级会按照下面的顺序指定:
HTTP Content-Type
@charset rule ,例如(@charset "gb2312";,@charset "utf-8";)

<link charset=”..” rel=”stylesheet” … />



相关资讯

  • 通过js判断浏览器是否支持HTML5特性

    在开发的过程中有时候需要对一些html5的专属特性进行判断,判断浏览器是否支持HTML5特性,一般是通过js进行判断,目前判断浏览器是否支持html5特性,主要通过js判断是否支持html5特性中的某种特性,例如像window.applicationCache,Canvas,Worker。

    2016/7/6 12:11:21
  • Js通过referrer获取搜索引擎来源

    在做网站优化的时候,需要了解用户搜索引擎来源,可以在Html页面中通过JS获取document.referrer,然后在document.referrer中通过搜索引擎对应的域名进行识别。 比如百度对应域名中的存在‘baidu’,360 搜中,含有so.com,可以作为标识。

    2016/5/20 11:17:05

共有访客发表了评论 网友评论

验证码: 看不清楚?