如何在CSS中分别定义中文字体和英文字体

html-css017

如何在CSS中分别定义中文字体和英文字体,第1张

这里我不清楚题主你具体的类名,我就给你大概写一个吧。

html{ font-family:"中文某字体","英文某字体"}

这样就可以为html同时设置中文和英文的字体,html会自动识别文字的中英文,并引用指定字体。

font-family的调用方法:

代码如下:

div {

font-family:Arial,'Times New Roman','Microsoft YaHei',SimHei

font:bold 12px/0.75em Arial,'Times New Roman','Microsoft YaHei',SimHei

}

根据font-family的原则,假如客户终端不认识前面的字体,就自动切换到第二种字体,第二种不认识就切换到第三种,以此类推.假如都不能识别就调用默认字体

根据font-family的字体调用原则我们可以为英文,中文,等两种字体调用不同的字体来渲染.

如:Arial,’Times New Roman’这两种字体不认识中文,只认识英文,所以,这两种字体只能渲染英文数字和一些特殊符号,而页面中的中文就会自动调用第三种字体Microsoft YaHei(PS:假如存在这种字体的话).

所以,在定义字体的时候把英文的字体写在前面把中文的写在后面.这样,系统就会自动按顺序依次给字用字体,如果当前字体不支持文本,自动换用列表中的下一个字体

经过测试,IE9、IE9兼容模式(兼容IE8)、Chrome浏览器最新版本(34.0)、 Firefox浏览器最新版本(29.0)支持该font-family属性;

但是某些版本的IE浏览器(IE7、IE8)无法实现该font-family属性的要求,还会暴露出一些奇怪的 bug。如在这些版本的浏览器下使用中文字体(比如微软雅黑),需要把该中文字体放到font-family属性的首位,但是会导致英文字体也会使用该中文字体渲染。即在这些浏览器(IE7、IE8)下不支持在font-family属性中为英文和中文字体分别使用不同的字体。

使用行内样式span,这样可以保证文字不换行,然后再单独定义span样式文字字体号;

如:

<style>

.aa{ font-family:"微软雅黑"font-size:18pxcolor:#333333}

.aa span{ font-family:Arialfont-size:12pxcolor:#990000}

</style>

<div class="aa">中文字体号和颜色<span>This english</span></div>

效果如下图