怎么用CSS调整字间距

汉字间字间距设置:letter-spacing
英文间字间距设置:word-spacing:

H3 { word-spacing: 1em }
参数:
in (英寸)
cm (厘米)
mm (毫米)
pt (点数)
pc (打字机字间距)
em (ems)
ex (x-height)
px (象素)

字间距letter-spacing:*px;  文字间距。
定义一个附加在文字之间的间隔数量。该值必须符合长度格式,允许使用负值。

字间距word-spacing  属性增加或减少单词间的空白(即字间隔)。
该属性定义元素中字之间插入多少空白符。针对这个属性,“字” 定义为由空白符包围的一个字符串。如果指定为长度值,会调整字之间的通常间隔;所以,normal 就等同于设置为 0。允许指定负长度值,这会让字之间挤得更紧。
实例
规定段落中的字间距是 25 像素:
p
{
word-spacing:25px;
}
浏览器支持所有浏览器都支持 word-spacing 属性。注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit"。
提示和注释注释:CSS 把“字(word)”定义为任何非空白符字符组成的串,并由某种空白字符包围。这个定义没有实际的语义,它只是假设一个文档包含由一个或多个空白字符包围的字。支持 CSS 的用户代理不一定能确定一个给定语言中哪些是合法的字,而哪些不是。尽管这个定义没有多大价值,不过它意味着采用象形文字的语言或非罗马书写体往往无法指定字间隔。提示:利用这个属性,可能会创建字间隔太宽的文档,所以,使用 word-spacing 时要小心。

<html>
<style type="text/css">
<!--
    p.p1{word-spacing:5cm}
     p.p2{word-spacing:5mm}
     p.p3{word-spacing:5pt}
     p.p4{word-spacing:5px}
     p.p5{word-spacing:5in}
     p.p6{word-spacing:5pc}
    
-->
</style>
<head>
     <title>CSS</title>
</head>
<body>
     <p>Welcome to Magci's BLOG!</p>
     <p class="p1">Welcome to Magci's BLOG!</p>
     <p class="p2">Welcome to Magci's BLOG!</p>
     <p class="p3">Welcome to Magci's BLOG!</p>
     <p class="p4">Welcome to Magci's BLOG!</p>
     <p class="p5">Welcome to Magci's BLOG!</p>
     <p class="p6">Welcome to Magci's BLOG!</p>
</body>
</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值