许多童鞋在写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. 1094. The Largest Generation (25)-(dfs,树的遍历,统计每层的节点数)

    题目很简单,就是统计一下每层的节点数,输出节点数最多的个数和对应的层数即可. #include <iostream> #include <cstdio> #include &l ...

  2. The role of the inter-controller consensus in the placement of distributed SDN controllers

    2017 Computer Communications 问题:in-band网络的多控制器放置问题,考虑到多个控制器之间的同步(Ctr-Ctr)可能影响到控制器与交换机(Ctr-Sw)的时延: 关于 ...

  3. Leetcode题库——48.旋转图像

    @author: ZZQ @software: PyCharm @file: rotate.py @time: 2018/11/16 15:41 要求:给定一个 n × n 的二维矩阵表示一个图像.将 ...

  4. Beta 冲刺 二

    团队成员 051601135 岳冠宇 031602629 刘意晗 031602248 郑智文 031602330 苏芳锃 031602234 王淇 照片 项目进展 岳冠宇 昨天的困难 fragment ...

  5. ejabberd与XMPP

    ejabberd支持XMPP协议. worktile用ejabberd来做了实时消息推送: https://worktile.com/tech/basic/worktile-real-time-not ...

  6. [转帖]Windows 使用netsh 命令行方式处理 windows防火墙的方法

    Windows防火墙命令行手册 https://blog.csdn.net/mystudyblog0507/article/details/79617629 简介 netsh advfirewall ...

  7. UOJ#424 【集训队作业2018】count

    题意 我们定义长度为\(n\),每个数为\(1\sim m\)之间的整数且\(1\sim m\)都至少出现一次的序列为合法序列.再定义\(pos(l,r)\)表示这个序列的区间\([l,r]\)之间的 ...

  8. Codeforces Round #530 Div. 1 自闭记

    A:显然应该让未确定的大小尽量大.不知道写了啥就wa了一发. #include<iostream> #include<cstdio> #include<cmath> ...

  9. KD-Tree学习笔记

    参考:https://trinkle23897.github.io/pdf/K-D%20Tree.pdf KD-Tree是一种维护K维空间点的类似BST的数据结构.绝大多数时候只用来维护二维空间的点, ...

  10. BZOJ4559 JLOI2016成绩比较(容斥原理+组合数学+斯特林数)

    容斥一发改为计算至少碾压k人的情况数量,这样对于每门课就可以分开考虑再相乘了.剩下的问题是给出某人的排名和分数的值域,求方案数.枚举出现了几种不同的分数,再枚举被给出的人的分数排第几,算一个类似斯特林 ...