CSS-针对中英文混合站点CSS字体定义

Question

百度该问题会找到很多不错的font-family推荐，对于全英文网站来说可能还好，但是对于中文、英文、数字等混排的网页，一直没有找到一个十分完美的解决方案。

请推荐。

Answer 1

以前也很纠结这个问题过，如果是固定位置出现的英文/数字，是可以手动添加classname的，也查了很多资料过，对于随机出现了英文，却是木有很好的方案，但用js可以实现作者想要的效果：
如果一段文字中确定中文大于英文的，那要先设置对主流字体适合的font-family，如中文居多的，可以设置全文字体为：微软雅黑（或者其他），文中出现的英文或者数字设置字体为Arial，为了区分来看，我设置了颜色加以区分，代码如下：
css：

<style>
.red{color:red; font-family:'微软雅黑'; font-size:15px;}
.green{color:green; font-family:Arial; font-weight:bold;}
</style>

html：

<div id="content" class="red"> 士大夫士大夫是是否是sdfs s f士' " ，,。.？?‘'“” 大夫 sdfsdf,sdf,sdf士大夫，士大夫，双方都， </div>

javascript：

 <script>
var content=document.getElementById("content").innerHTML;
content=content.replace(/([w,.?;!]+)/g, '<span class="green">$1</span>'); //把英文替换成 <span>英文</span>
document.getElementById("content").innerHTML=content;
</script>

完成！

Answer 2

亲，您是指通用样式表的reset吧，使用中文字体和使用英文字体差别还是蛮大的哦，亲，看下面的图，您就能明白中文字体和英文字体差别在哪里

亲，您应该可以很明显的看到用英文字体时能达到预期效果，这里只写了中文和英文，至于数字也是一样的效果哦。

通用的写法如下：
body{font:12px/1.125 Arial,Helvetica,sans-serif;}
这里的1.125表示行高，一般段落p元素的默认行高值为1.125em；这里使用的默认值

亲，希望对您有帮助哦。