您的位置:首页 > CSS技巧 >

 

css中文字间距 汉字字间距设置

 

css中文字间距设置篇

有时在DIV CSS布局时,局部对中文字中文汉字字与字之间设置一定距离(中文字间距)如何设置?使用什么属性设置呢?

中文字的字与字间距设置使用letter-spacing属性实现。

css letter-spacing是设置字与字间距的样式。

  1. div{letter-spacing:2px} 

设置div内文字字间距为2px。同样中文字字间距自然也是2px宽度间隔间距。

中文字字间距实例,这里设置两个div盒子,分别设置不同letter-spacing字间距,看看汉字中文字字间距设置效果。

CSS实例代码如下:

  1. <!DOCTYPE html> 
  2. <html> 
  3. <head> 
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  5. <title>中文字间距实例 ThinkCSS</title> 
  6. <style> 
  7. .expa{ letter-spacing:4px;} 
  8. .expb{ letter-spacing:8px} 
  9. </style> 
  10. </head> 
  11. <body> 
  12. 欢迎访问ThinkCSS网站<br /> 
  13. <span class="expa">中文字间距测试文字!</span><br> 
  14. <span class="expb">中文汉字字间距测试内容!</span> 
  15. </body> 
  16. </html> 

以上中文字字间距实例代码可直接复制后测试观察效果。

中文字不同字间距实例效果截图

CSS中文字字间距设置实例效果截图
CSS中文字字间距设置实例效果截图

无论中文字还是英文字或字符间距都使用letter-spacing字间距样式实现。

下划线扩展了解:
CSS下划线与字体距离

标签(Tag): 字间距 间隔
本文分享URL地址:http://www.css5.com.cn/jiqiao/971.html

更多

 

CSS必备基础教程 - TOP

 

热门信息

 

CSS5更新 - TOP

 

 

如对文章有任何疑问请提交到DIV CSS论坛,或有任何网页制作CSS问题立即到CSS论坛发贴求解。
CSS教程文章修订日期::2016-07-27     点击:
原创:CSS5     来源网址:http://www.css5.com.cn/jiqiao/971.html
本文www.css5.com.cn(DIV CSS) CSS5版权所有,欢迎转载,并注明出处来源及URL!