一、css方法
先定义一个英文字体再定义中文字体,这是因为英文字体中一般不含有中文,执行的时候英文和阿拉伯数字选用“Arial”,中文的字体使用第二个字体微软雅黑。比如,可以这样来定义WordPress中的中英文字体:

body{

font-family: Arial,"微软雅黑";

}

*需要注意的是,这样的做法对符合网页规范的浏览器比如Firefox虽然有效,但对IE6IE7会导致中文字体设定无效,也就是说,这样的办法对于微软的IE系列来说等于不设置中文字体,而只是采用系统默认的宋体来显示网页内容。

也可以指定两个class分别分配给中文和英文内容,这样就可以对IE也实现如上的字体效果,并可以为中英文的显示进行更详细的定制(比如字号等属性),但缺点是这样的做法比较繁杂,使用上不太方便,特别是对博客这样的中英文混编的文章内容来说更是麻烦。

二、使用js实现

当然也能用JavaScript+Css来实现这个效果,实现方式可以参考经典论坛上的相关帖子:

 
  
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
  2.    
  3. <html xmlns="http://www.w3.org/1999/xhtml"> 
  4.    
  5. <head> 
  6.    
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  8.    
  9. <title>无标题文档</title> 
  10.    
  11. </head> 
  12.    
  13. <style> 
  14.    
  15. .cn{font-size:12px;font-family:宋体;}  
  16.    
  17. body{font-family:"Comic Sans MS";}  
  18.    
  19. </style> 
  20.    
  21. <script > 
  22.    
  23. function xsize(xstr){return xstr.replace(/([\u0391-\uFFE5]+)/ig,"<font class=\"cn\">$1<\/font>");}  
  24.    
  25. </script> 
  26.    
  27.  
  28. <body onload="bb.innerHTML=xsize(bb.innerHTML)" id="bb"> 
  29.    
  30.  
  31. --hello~ 曾经某国留学生到米国旅游,遇到某事故,然后翻车在里面等待救援。<br/> 
  32.    
  33.  
  34. --米国某人看到问其:"how are you?"<br /> 
  35.    
  36.  
  37. --某国留学生说:"oh~ i'm fine?and you?"~<br /> 
  38.    
  39.  
  40. --米国某人说:"oh~fine too"然后走了<br /> 
  41.    
  42.  
  43. </body> 
  44.    
  45. </html>