css font-family字体大全

css font-family字体大全 CSS能用安全字体

CSS设置字体，使用font-family样式设置字体。

HTML网页布局时，想让自己网页字体漂亮，就设置自己安装好的字体这种想法是错误的，设置后也会出现显示字体兼容问题。因为你自己电脑安装了这些字体，而浏览者没有安装，就会出现设置字体自己电脑打开浏览字体没问题正常显示为自己设置字体，而客户因为没有安装就会造成显示浏览器默认分配大家电脑都安装的字体，这样造成css字体兼容问题。

一、CSS使用下载自定义字体

如果要设置自己想要的字体，方法是有的，需要下载字体对应eot字体、ttf字体、woff字体。使用@font-face font-family引入自己安装字体。

使用自己下载字体代码：

@font-face { font-family : name ; src : url( url ) ; sRules } 

即：

@font-face { 
font-family: 'codropsicons'; 
src:url('.../codropsicons.eot'); 
} 

解释：
codropsicons为自己自定义字体，url是你下载的字体文件路径，同时需要将字体文件放入div css布局项目中，CSS字体路径引入正确。

值得注意@font-face 可以引入下载的字体，但是eot字体是比较难找到的，一般有的时候是需要去出钱购买的。

二、css安全的字体大全

通常网页布局时候CSS设置字体都是使用比较安全的字体，也就是大家电脑系统默认安装有的字体。

HTML8推荐常用字体大全：
中文字体：
宋体
黑体
微软雅黑

英文字体：
Arial, Helvetica, sans-serif
Tahoma, Geneva, sans-serif

虽然以上字体不多，但是一般网页都是设置以上几个常用字体。以上CSS字体足够用，而且经典兼容各大系统平台！

需要注意中文字体需要转换下：
中文字体转Unicode编码