深入理解letter-spacing,word-spacing的对比区别

letter-spacing  

lletter-spacing 属性增加或减少字符间的空白(字符间距)。

该属性定义了在文本字符框之间插入多少空间。由于字符字形通常比其字符框要窄,指定长度值时,会调整字母之间通常的间隔。因此,normal 就相当于值为 0。

<p style="letter-spacing:10px;"> thisisatest </p> //显示: t h i s a t e s t <p style="letter-spacing:10px;"> 这是一个测试</p> //显示:这 是 一 个 测 试

word-spacing  

word-spacing 属性增加或减少单词间的空白(即字间隔)。

该属性定义元素中字之间插入多少空白符。针对这个属性,“字” 定义为由空白符包围的一个字符串。如果指定为长度值,会调整字之间的通常间隔;所以,normal 就等同于设置为 0。允许指定负长度值,这会让字之间挤得更紧。

<p style="word-spacing:10px;"> this is a  test</p> //显示: this is a test*/ <p style="word-spacing:10px;">这 是 一 个 测 试 </p> //显示: 这 是 一 个 测 试

letter-spacing,word-spacing的区别

word-spacing 属性增加或减少单词间的空白(即字间隔)。 letter-spacing 属性增加或减少字符间的空白(字符间距)。word-spacing意思是设置单词间的间距,如何区别是不是为一个单词呢,这里我们可以看出 用空格隔开的为一个单词,所以在执行word-spacing:10px;执行的前后可以发现,执行后空格变得更大了!!

猜你喜欢

转载自www.cnblogs.com/ypppt/p/12909859.html