您现在的位置是：网站首页> 编程资料编程资料
中文字体在CSS中的写法整理CSS字体中英文名称对照表 CSS常用中文字体英文名称对照表css中默认中文字体font-family列表CSS font-family为英文和中文字体分别设置不同的字体CSS中文字体对应的英文写法(常用整理)css中 中文字体相关知识汇总
2021-09-07
1417人已围观
简介 在CSS中不能出现中文字体，解决办法就是把这些中文字体名字转换成英文名，下面简要的为大家介绍下中文字体在CSS中的写法，有以上问题的朋友可以参考下
今天在折腾wordpress主题的时候，想把侧边栏上的2个标题转换为“方正姚体”，用Firebug调试OK了，保存到css文件里上传后，可是怎么弄也显示不对，网上搜索了一下，才知道原来在CSS中不能出现中文字体，解决办法就是把这些中文字体名字转换成英文名。
Unicode简单的说一下制作网页时的为了兼顾到一些浏览器CSS样式文档中一般是不出现中文字体的，尤其是 {}中，因此通过参照下表将其对应转编，可以将中文名转成英文名、unicode、unicode2注意unicode2是直接输出为文本的，
比如：微软雅黑，我们在CSS中的设置为
font-family:”Microsoft Yahei”;
也可以是对应的unicode
font-family:”\5FAE\8F6F\96C5\9ED1″;
但微软雅黑对应的unicode2即微软正黑体写在样式文档里是没有效果的，因为unicode2是以文本形式输出的，这个可以将对应的unicode2 放到html文档中尝试一下，对应输出微软雅黑四个字
常用字体设置
font-family:' SimSun','\5B8B\4F53' /*宋体*/
font-family:' Microsoft Yahei','\5FAE\8F6F\96C5\9ED1' /*微软雅黑*/
中文名英文名UnicodeUnicode 2
Mac OS
华文细黑STHeiti Light [STXihei] \534E\6587\7EC6\9ED1 华文细黑
华文黑体STHeiti \534E\6587\9ED1\4F53 华文黑体
华文楷体STKaiti \534E\6587\6977\4F53 华文楷体
华文宋体STSong \534E\6587\5B8B\4F53 华文宋体
华文仿宋STFangsong \534E\6587\4EFF\5B8B 华文仿宋
丽黑 ProLiHei Pro Medium \4E3D\9ED1 Pro 丽黑 Pro
丽宋 ProLiSong Pro Light\4E3D\5B8B Pro丽宋 Pro
标楷体BiauKai\6807\6977\4F53标楷体
苹果丽中黑Apple LiGothic Medium \82F9\679C\4E3D\4E2D\9ED1 苹果丽中黑
苹果丽细宋Apple LiSung Light \82F9\679C\4E3D\7EC6\5B8B 苹果丽细宋
Windows
新细明体PMingLiU\65B0\7EC6\660E\4F53新细明体
细明体MingLiU\7EC6\660E\4F53细明体
标楷体DFKai-SB\6807\6977\4F53标楷体
黑体SimHei\9ED1\4F53黑体
宋体SimSun\5B8B\4F53宋体
新宋体NSimSun\65B0\5B8B\4F53新宋体
仿宋FangSong\4EFF\5B8B仿宋
楷体KaiTi\6977\4F53楷体
仿宋_GB2312FangSong_GB2312\4EFF\5B8B_GB2312仿宋_GB2312
楷体_GB2312KaiTi_GB2312\6977\4F53_GB2312楷体_GB2312
微软正黑体Microsoft JhengHei\5FAE\x8F6F\6B63\9ED1\4F53微软正黑体
微软雅黑Microsoft YaHei\5FAE\8F6F\96C5\9ED1微软雅黑
Office
隶书LiSu\96B6\4E66隶书
幼圆YouYuan\5E7C\5706幼圆
华文细黑STXihei\534E\6587\7EC6\9ED1华文细黑
华文楷体STKaiti\534E\6587\6977\4F53华文楷体
华文宋体STSong\534E\6587\5B8B\4F53华文宋体
华文中宋STZhongsong\534E\6587\4E2D\5B8B华文中宋
华文仿宋STFangsong\534E\6587\4EFF\5B8B华文仿宋
方正舒体FZShuTi\65B9\6B63\8212\4F53方正舒体
方正姚体FZYaoti\65B9\6B63\59DA\4F53方正姚体
华文彩云STCaiyun\534E\6587\5F69\4E91华文彩云
华文琥珀STHupo\534E\6587\7425\73C0华文琥珀
华文隶书STLiti\534E\6587\96B6\4E66华文隶书
华文行楷STXingkai\534E\6587\884C\6977华文行楷
华文新魏STXinwei\534E\6587\65B0\9B4F华文新魏
Unicode简单的说一下制作网页时的为了兼顾到一些浏览器CSS样式文档中一般是不出现中文字体的，尤其是 {}中，因此通过参照下表将其对应转编，可以将中文名转成英文名、unicode、unicode2注意unicode2是直接输出为文本的，
比如：微软雅黑，我们在CSS中的设置为
font-family:”Microsoft Yahei”;
也可以是对应的unicode
font-family:”\5FAE\8F6F\96C5\9ED1″;
但微软雅黑对应的unicode2即微软正黑体写在样式文档里是没有效果的，因为unicode2是以文本形式输出的，这个可以将对应的unicode2 放到html文档中尝试一下，对应输出微软雅黑四个字
常用字体设置
font-family:' SimSun','\5B8B\4F53' /*宋体*/
font-family:' Microsoft Yahei','\5FAE\8F6F\96C5\9ED1' /*微软雅黑*/
中文名英文名UnicodeUnicode 2
Mac OS
华文细黑STHeiti Light [STXihei] \534E\6587\7EC6\9ED1 华文细黑
华文黑体STHeiti \534E\6587\9ED1\4F53 华文黑体
华文楷体STKaiti \534E\6587\6977\4F53 华文楷体
华文宋体STSong \534E\6587\5B8B\4F53 华文宋体
华文仿宋STFangsong \534E\6587\4EFF\5B8B 华文仿宋
丽黑 ProLiHei Pro Medium \4E3D\9ED1 Pro 丽黑 Pro
丽宋 ProLiSong Pro Light\4E3D\5B8B Pro丽宋 Pro
标楷体BiauKai\6807\6977\4F53标楷体
苹果丽中黑Apple LiGothic Medium \82F9\679C\4E3D\4E2D\9ED1 苹果丽中黑
苹果丽细宋Apple LiSung Light \82F9\679C\4E3D\7EC6\5B8B 苹果丽细宋
Windows
新细明体PMingLiU\65B0\7EC6\660E\4F53新细明体
细明体MingLiU\7EC6\660E\4F53细明体
标楷体DFKai-SB\6807\6977\4F53标楷体
黑体SimHei\9ED1\4F53黑体
宋体SimSun\5B8B\4F53宋体
新宋体NSimSun\65B0\5B8B\4F53新宋体
仿宋FangSong\4EFF\5B8B仿宋
楷体KaiTi\6977\4F53楷体
仿宋_GB2312FangSong_GB2312\4EFF\5B8B_GB2312仿宋_GB2312
楷体_GB2312KaiTi_GB2312\6977\4F53_GB2312楷体_GB2312
微软正黑体Microsoft JhengHei\5FAE\x8F6F\6B63\9ED1\4F53微软正黑体
微软雅黑Microsoft YaHei\5FAE\8F6F\96C5\9ED1微软雅黑
Office
隶书LiSu\96B6\4E66隶书
幼圆YouYuan\5E7C\5706幼圆
华文细黑STXihei\534E\6587\7EC6\9ED1华文细黑
华文楷体STKaiti\534E\6587\6977\4F53华文楷体
华文宋体STSong\534E\6587\5B8B\4F53华文宋体
华文中宋STZhongsong\534E\6587\4E2D\5B8B华文中宋
华文仿宋STFangsong\534E\6587\4EFF\5B8B华文仿宋
方正舒体FZShuTi\65B9\6B63\8212\4F53方正舒体
方正姚体FZYaoti\65B9\6B63\59DA\4F53方正姚体
华文彩云STCaiyun\534E\6587\5F69\4E91华文彩云
华文琥珀STHupo\534E\6587\7425\73C0华文琥珀
华文隶书STLiti\534E\6587\96B6\4E66华文隶书
华文行楷STXingkai\534E\6587\884C\6977华文行楷
华文新魏STXinwei\534E\6587\65B0\9B4F华文新魏
相关内容
- CSS多浏览器兼容总结(个人经验)简要总结CSS编程中的响应式设计CSS的一些编程规范总结10个必备的CSS技巧总结CSS清除浮动方法总结css 调试方法与经验总结CSS样式的基础学习总结深入CSS3 动画效果的总结详解IE下css常见问题总结及解决CSS(Cascading Style Sheet)级联样式表常用术语总结CSS学习总结
- css设置矢量图字体图标的方法(图解)CSS实现精灵图与字体图标纯CSS3实现带有字体图标效果的灰白色下拉网站导航让我来教你使用css中的字体图标的方法
- CSS中关于居中的小技巧个人小结CSS网页布局25个实用小技巧25条div+css编程提醒及小技巧整理 CSS小技巧:为不同类型的文件设置不同的链接样式书写CSS的5个小技巧让你的样式更规范适合新手的CSS网页布局小技巧整理29个常用的CSS小技巧汇总三个很特别的CSS小技巧分享
- CSS水平对齐示例介绍CSS Transition通过改变Height实现展开收起元素从QQtabBar看css命名规范BEM的详细介绍css实现两栏布局，左侧固定宽，右侧自适应的多种方法CSS 实现Chrome标签栏的技巧CSS实现两列布局的N种方法CSS实现隐藏搜索框功能(动画正反向序列)CSS3中Animation实现简单的手指点击动画的示例详解CSS中的特指度和层叠问题详解overflow:hidden的作用(溢出隐藏、清除浮动、解决外边距塌陷)关于CSS浮动与取消浮动的问题
- CSS子元素选择器使用介绍CSS Transition通过改变Height实现展开收起元素从QQtabBar看css命名规范BEM的详细介绍css实现两栏布局，左侧固定宽，右侧自适应的多种方法CSS 实现Chrome标签栏的技巧CSS实现两列布局的N种方法CSS实现隐藏搜索框功能(动画正反向序列)CSS3中Animation实现简单的手指点击动画的示例详解CSS中的特指度和层叠问题详解overflow:hidden的作用(溢出隐藏、清除浮动、解决外边距塌陷)关于CSS浮动与取消浮动的问题
- IE下使用form时所在行被撑高的解决方法浅谈原生页面兼容IE9问题的解决方案新版chrome浏览器设置允许跨域的实现css hack之\9和\0就可能对hack IE11\IE9\IE8无效css区分ie8/ie9/ie10/ie11 chrome firefox的代码解决CSS浏览器兼容性问题的4种方案常见的浏览器兼容性问题(小结)border-radius IE8兼容处理的方法浅谈遇到的几个浏览器兼容性问题base64图片在各种浏览器的兼容性处理 对常见的css属性进行浏览器兼容性总结(推荐)
- css页面左中右分栏布局示例用纯CSS实现容器内图片上下左右居中css实现div内图片上下左右居中css页面中常见左中右分栏布局的两种实现方式详解css布局实现左中右布局的5种方式
- div css 实现tabs标签的思路及示例代码设置div背景透明的方法示例CSS实现div不设高度完全居中div自适应高度自动填充剩余高度详解DIV+CSS的命名规矩才能有利于SEO优化的实现方法DIV或者DIV里面的图片水平与垂直居中的方法详解如何用div实现自制滚动条div对齐与网页布局详解DIV+CSS实现电台列表设计的示例代码div+css实现带箭头的面包屑导航栏不定宽高的文字在div中垂直居中实现方法
- css中clearfix清除浮动的用法及其原理示例介绍浅谈css清除浮动(clearfix和clear)的用法CSS中使用clearfix清除浮动的方法用clearfix:after消除css浮动解决外部div不能撑开问题css清除浮动clearfix:after的用法详解（附完整代码）css之clearfix的用法深入理解(必看篇)
- 一个看起来比较舒服值得学习的文本框样式CSS Transition通过改变Height实现展开收起元素从QQtabBar看css命名规范BEM的详细介绍css实现两栏布局，左侧固定宽，右侧自适应的多种方法CSS 实现Chrome标签栏的技巧CSS实现两列布局的N种方法CSS实现隐藏搜索框功能(动画正反向序列)CSS3中Animation实现简单的手指点击动画的示例详解CSS中的特指度和层叠问题详解overflow:hidden的作用(溢出隐藏、清除浮动、解决外边距塌陷)关于CSS浮动与取消浮动的问题
