CSS字体库

常用字体对应表：

HTML，CSS，font-family：中文字体的英文名称

宋体 SimSun

黑体 SimHei

微软雅黑 Microsoft YaHei

微软正黑体 Microsoft JhengHei

新宋体 NSimSun

新细明体 PMingLiU

细明体 MingLiU

标楷体 DFKai-SB

仿宋 FangSong

楷体 KaiTi

仿宋_GB2312 FangSong_GB2312

楷体_GB2312 KaiTi_GB2312

宋体：SimSuncss中中文字体（font-family）的英文名称

Mac OS的一些：

华文细黑：STHeiti Light [STXihei]

华文黑体：STHeiti

华文楷体：STKaiti

华文宋体：STSong

华文仿宋：STFangsong

儷黑 Pro：LiHei Pro Medium

儷宋 Pro：LiSong Pro Light

標楷體：BiauKai

蘋果儷中黑：Apple LiGothic Medium

蘋果儷細宋：Apple LiSung Light

Windows的一些：

新細明體：PMingLiU

細明體：MingLiU

標楷體：DFKai-SB

黑体：SimHei

新宋体：NSimSun

仿宋：FangSong

楷体：KaiTi

仿宋_GB2312：FangSong_GB2312

楷体_GB2312：KaiTi_GB2312

微軟正黑體：Microsoft JhengHei

微软雅黑体：Microsoft YaHei

装Office会生出来的一些：

隶书：LiSu

幼圆：YouYuan

华文细黑：STXihei

华文楷体：STKaiti

华文宋体：STSong

华文中宋：STZhongsong

华文仿宋：STFangsong

方正舒体：FZShuTi

方正姚体：FZYaoti

华文彩云：STCaiyun

华文琥珀：STHupo

华文隶书：STLiti

华文行楷：STXingkai

华文新魏：STXinwei

@网站应用：

京东body和字体初始化代码（借鉴）：
a, address, b, big, blockquote, body, center, cite, code, dd, del, div, dl, dt, em, fieldset, font, form, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, label, legend, li, ol, p, pre, small, span, strong, u, ul, var {
margin: 0;
padding: 0;
}
body {
background: #fff none repeat scroll 0 0;
color: #666;
font: 12px/150% Arial,Verdana,“宋体”;
}
黄淮字体初始化代码(反面教材)：
body {

color: #666;
font-family: “宋体”,“SimSun”;
font-size: 12px;
line-height: 1.5;
}
—宋体在显示英文时很丑，例如小写的g
物通网字体初始化代码：
body {
background: #fff none repeat scroll 0 0;
color: #333333;
font-family: Tahoma,Arial,“宋体”;
font-size: 12px;
line-height: 22px;
margin: 0;
padding: 0 0 12px;
}
新一站body和字体初始化代码（借鉴）：
body, html {
font-family: Tahoma,Arial,“Hiragino Sans GB”,simsun,sans-serif;
font-size: 12px;
height: 100%;
line-height: 1.6;
}
a, abbr, acronym, address, article, aside, audio, blockquote, body, button, canvas, caption, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, html, iframe, img, ins, label, legend, li, mark, menu, meter, nav, object, ol, output, p, pre, progress, q, s, section, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, u, ul, var, video {
border: 0 none;
margin: 0;
padding: 0;
}
淘宝body和字体初始化代码（借鉴）：
blockquote, body, button, dd, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, hr, input, legend, li, ol, p, pre, td, textarea, th, ul {
margin: 0;
padding: 0;
}
body, button, input, select, textarea {
font: 12px/1.5 tahoma,arial,“Hiragino Sans GB”,宋体,sans-serif;
}
锤子科技body和字体初始化代码（借鉴）：
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
margin: 0;
padding: 0;
}
body {
color: #666;
font-family: Helvetica,Arial,“Hiragino Sans GB”,“Microsoft Yahei”,“微软雅黑”,STHeiti,“华文细黑”,sans-serif;
font-size: 14px;
}
新浪body和字体初始化代码（借鉴）：
html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img {
margin: 0;
padding: 0;
}
body {
background: #fff none repeat scroll 0 0;
color: #333;
font: 12px/20px “SimSun”,“宋体”,“Arial Narrow”,HELVETICA;
padding: 5px 0;
}
.main-nav {
font-family: “Microsoft YaHei”,“微软雅黑”,“SimSun”,“宋体”;
}
body, td, th {
font-family: 宋体;
}
—整站大部分用的是宋体16x/26x

@CSS设置字体方法

CSS如何控制字间距？

在需要设置的CSS标签下加入一下代码即可。 word-spacing:8px; letter-spacing: 1px; 具体是哪个自己配置测试下。

@CSS,font-family,好看常用的中文字体

转载自http://www.zreading.cn/ican/2014/10/css-font-family/

例1（小米米官网）：font-family: “Arial”,“Microsoft YaHei”,“黑体”,“宋体”,sans-serif;

例2（淘宝技术研发中心）：font: 12px/1.5 Tahoma,Helvetica,Arial,‘宋体’,sans-serif;

例3（加网）：font: 14px/1.5 ‘Microsoft YaHei’,arial,tahoma,\5b8b\4f53,sans-serif;

例4（淘宝UED）：font: 12px/1 Tahoma,Helvetica,Arial,"\5b8b\4f53",sans-serif;

例5（一淘UX）:font-family: Helvetica, ‘Hiragino Sans GB’, ‘Microsoft Yahei’, ‘微软雅黑’, Arial, sans-serif;

font: 12px/1 Tahoma,Helvetica,Arial,"\5b8b\4f53",sans-serif;

—总结百家所长：font: 12px/150% Tahoma,Helvetica,Arial,Verdana,“Microsoft YaHei”,“SimSun”,“宋体”;

Windows 中的中文字体。
在默认情况下，也就是未自行安装新字体或者 Office 等文字处理软件的情况下，Windows 默认提供下列字体：

Windows 95/98/98SE 宋体、黑体、楷体_GB2312、仿宋_GB2312

Windows XP/2000/2003/ME/NT 宋体/新宋体、黑体、楷体_GB2312、仿宋_GB2312 (Windows XP SP3 宋体-PUA)

Windows Vista/7/2008 宋体/新宋体、黑体、楷体、仿宋、微软雅黑、SimSun-ExtB
那么每种字体能显示那些汉字呢？

Vista 之前的 Windows 中宋体/新宋体、黑体支持 GBK 1.0 字符集，
楷体_GB2312、仿宋_GB2312 支持 GB2312-80 字符集。
（注：Windows 3.X 只能支持 GB2312-80 字符集）

Vista 及之后的 Windows 中宋体/新宋体、黑体、楷体、仿宋、微软雅黑支持 GB18030-2000 字符集，

SimSun-ExtB 只支持 GB18030-2005 字符集扩展 B 部分。
下面对字符集进行简单的介绍：

GB2312-80 < GBK 1.0 < GB18030-2000 < GB18030-2005

GB2312-80 中的字符数量最少，GB18030-2005 字符数量最多。

GB2312-80 是最早的版本，字符数比较少；

GBK 1.0 中的汉字大致与 Unicode 1.1 中的汉字数量相同；

GB18030-2000 中的汉字大致与 Unicode 3.0 中的汉字数量相同，主要增加了扩展 A 部分；

GB18030-2005 中的汉字大致与 Unicode 4.1 中的汉字数量相同，主要增加了扩展 B 部分；

由于 Unicode 5.2 的发布，估计 GB18030 会在近期发布新版本，增加扩展 C 部分。

需要说明的是在 GB18030 中扩展 B 部分并不是强制标准。

如果想查看 GB18030 的标准文本，请访问 http://www.gb168.cn 中的强标阅读。

如果想了解 Unicode 的内容，请访问 http://www.unicode.org。

现在纠正网上普遍的一个错误：
GB18030-2000 和 GB18030-2005 都不支持单字节的欧元符号
与简体中文有关的代吗页如下：

936 gb2312 简体中文(GB2312)————其实是GBK

10008 x-mac-chinesesimp 简体中文(Mac)

20936 x-cp20936 简体中文(GB2312-80)

50227 x-cp50227 简体中文(ISO-2022)

51936 EUC-CN 简体中文(EUC)

52936 hz-gb-2312 简体中文(HZ)

54936 GB18030 简体中文(GB18030)

补充：

使用楷体_GB2312、仿宋_GB2312后，在 Windows 7/Vista/2008 中可能不再显示为对应的字体。

这是因为 Windows 7/Vista/2008 中有楷体、仿宋，默认情况下没有楷体_GB2312、仿宋_GB2312，字体名称相差“_GB2312”。

@总结：

Arial出镜率最高，一般在第二位，Arial 确实是前 ClearType 时代 Windows 里最好的几个
正文字体之一（还有 Verdana 和 Tahoma 等）。
其次是Tahoma，3个大网站把它放在第一位。
宋体，“SimSun”—微软宋体，一般放在最后两位。
总结，使用原则------Tahoma，Arial，Verdana可以放在前边，宋体放在最后。其他可以尝试用下微软雅黑等字体。

字体名称最好写成英文，否则编码问题有些地区可能看到的是乱码
1.simsun=宋体

2.在西方国家罗马字母阵营中，字体分为两大种类：Sans Serif(偏粗，厚)和Serif(偏细)
—Verdana等则属于Sans Serif字体。对中文而言，同样存在这两大种类，很明显，
宋体、细明体(繁体中常用)等就属于Serif，而黑体、幼圆等则属于Sans Serif。

3.Microsoft Yahei微软雅黑

4.tahoma字体，Tahoma和Verdana师出同门，同为名设计师马修·卡特的作品。
—xyz首选字体

5.Arial，xyz次选字体

6.不会设计，仿好的网站，例如新一站的字体初始化代码：font-family: Tahoma,Arial,“Hiragino Sans GB”,“simsun”,sans-serif;

Mr_Han119

原创文章 8 获赞 34 访问量 882

关注私信