许多童鞋在写CSS的时候,设置中文字体常常使用中文字符,例如font-family:”黑体”,这样我们在浏览器中看到的是什么样子的呢 ?


如果不想自己写的界面在浏览器字体声明上有异常,建议在书写css样式规则的时候避免中文字符,使用Unicode编码集,对中文字符进行转码。常见的中文字符集转码如下表:

如果你不知道某个中文字体的Unicode编码,可以使用通过JS如下方法进行转化:

function toUnicode (str) {return escape(str).toLocaleLowerCase().replace(/%u/gi, '\\');}
console.log(toUnicode ('微软雅黑')); // '\5fae\8f6f\96c5\9ed1'

避免css中文字体在浏览器中解析成乱码的更多相关文章

  1. CSS 中文字体 Unicode 编码表

    CSS 中文字体 Unicode 编码表 在 CSS 中设置字体名称,直接写中文是可以的.但是在文件编码(GB2312.UTF-8 等)不匹配时会产生乱码的错误. 为此,在 CSS 直接使用 Unic ...

  2. CSS中文字体的英文名称 – 前台开发必备

    做什么用的?写过CSS的都晓得,一般用在font-family后面——为什么不用中文呢?有过一定开发经验的都晓得CSS里面用中文也是会乱码的,特别是没有中文字符集的浏览器,直接成了框框,用英文就可以解 ...

  3. CSS中文字体对照表

    http://hotoo.googlecode.com/svn/trunk/labs/css/css-fonts.html CSS中文字体对照表 css字体名可以使用2种Unicode格式,以“微软雅 ...

  4. css中文字体乱码解决方案

    css中文字体乱码解决方案:把css编码和html页面编码统一起来.如果html页面是utf-8.css.js也统一成utf-8编码.还有一个避免中文乱码的办法就是把中文字体写成英文来表示 css中文 ...

  5. CSS中文字体的英文名称(simsun)宋体,(Microsoft YaHei)微软雅黑

    CSS中文字体的英文名称(simsun)宋体,(Microsoft YaHei)微软雅黑 华文细黑:STHeiti Light [STXihei] 华文黑体:STHeiti 华文楷体:STKaiti ...

  6. css 中文字体 unicode 对照表

    css 中文字体可以用 unicode 格式来表示,比如“宋体”可以用 \5B8B\4F53 来表示.具体参考下表: 中文名 英文名 unicode 宋体 SimSun \5B8B\4F53 黑体 S ...

  7. 4.在浏览器中解析XML

    要在浏览器中解析获取XML数据,一般只需经过两个步骤:第一,将XML文档.XML字符串转化成XMLDoc对象.第二,使用JS操作XMLDoc对象. 3.1 将XML文档或XML字符串转化成XMLDoc ...

  8. 【css】css 中文字体 unicode 对照表

    css 中文字体可以用 unicode 格式来表示,比如“宋体”可以用 \5B8B\4F53 来表示.具体参考下表: 中文名 英文名 unicode 宋体 SimSun \5B8B\4F53 黑体 S ...

  9. myeclipse中的HTML页面在浏览器中显示为乱码

    myeclipse中的HTML页面在浏览器中显示为乱码 在通过myeclipse开发项目的过程中,如果用HTML页面书写前端,可能出现中文乱码现象,需要怎么解决呢?下面是我从网上搜的方法: 解决办法: ...

随机推荐

  1. springboot 前后端分离开发 从零到整(一、环境的搭建)

    第一次写文章,有什么错误地方请大家指正,也请大家见谅. 这次为大家分享我做毕业设计的一个过程,之前没有接触过springboot,一直做的都是Javaweb和前端,做了几个前后端分离的项目.现在听说s ...

  2. ELK日志方案--使用Filebeat收集日志并输出到Kafka

    1,Filebeat简介 Filebeat是一个使用Go语言实现的轻量型日志采集器.在微服务体系中他与微服务部署在一起收集微服务产生的日志并推送到ELK. 在我们的架构设计中Kafka负责微服务和EL ...

  3. 区块链学习:Windows下搭建以太坊私有链环境

    一:安装geth客户端 Windows要求必须是64位系统,从官方网站下载编译好的win64客户端,下载解压后只有一个Geth.exe问价,运行安装即可,下载地址如下: https://github. ...

  4. “数学口袋精灵”第二个Sprint计划(第三天)

    “数学口袋精灵”第二个Sprint计划----第三天进度 任务分配: 冯美欣:欢迎界面的背景音乐完善 吴舒婷:游戏界面的动作条,选择答案后的音效 林欢雯:代码算法设计 进度:   冯美欣:欢迎界面背景 ...

  5. Week1个人作业

    关于教材的疑问 阅读的教材<构建之法> 1第一章中提到:“软件企业=软件+商业模式”,这样的结构是否过于简单,尤其是在互联网+时代 2.在进行单元测试的时候,怎么做到100%覆盖 3.个人 ...

  6. Windows下PyInstaller的使用教程

    直接使用Python开发的软件时有许多不方便的地方,如需要安装特定的Python环境,需要安装依赖库.为了便于部署,需要将Python源代码编译成可执行文件,编译后的可执行文件就能脱离python环境 ...

  7. 远程显示(操作) 服务器 GUI 程序(图形化界面) (基于 X11 Forwarding + Centos + MobaXterm)

    在做 数据分析(数据挖掘 或 机器学习)的时候,我们经常需要绘制一些统计相关的图表,这些统计.绘图的程序常常是跑在服务器上的,可是服务器出于性能和效率的考虑,通常都是没有安装图形化界面的,于是这些统计 ...

  8. 如何用js替换文本里的换行符 \n?

    有下面一段文本, 在编辑器里的格式如下: <div id="foo"> line1line2line3</div> 切换到浏览器, 显示如下 line1li ...

  9. Java之Map的使用场景

    总结之 Map接口 的使用场景(day04) Map: Map中的集合,元素是成对存在的(理解为夫妻).每个元素由键与值两部分组成,通过键可以找对所对应的值 Map中的集合不能包含重复的键,值可以重复 ...

  10. C# Redis 切换数据库

    对于Redis来说,它具有库的概念. 但是他只能通过    ChangeDb(long类型) 来操作. 如下代码: //实例化redis         public static RedisClie ...