css设置字体间距

html-css013

css设置字体间距,第1张

01

先看下我们的html代码,很简单,就是一个div里有一段文字,我们为这个div添加了一个样式 zn

02

默认情况下,不加任何样式时,这段文字的间距是很小的,如图

03

为了添加文字的间距,我们可以添加letter-spacing的样式,添加一个zn的样式名,样式代码为 letter-spacing: 12px就是每个文字间会有12像素的间距。

04

再运行页面,就可以看到效果了。文字间的间距明显加大了。

可以使用

letter-spacing:*px

来控制文字间距,*px是指间距像素

这个不仅可以用在li里,其它需要文字排版的地方都可以使用

举个例子:

.list

li

{width:200px

text-align:center

height:22px

line-height:22px

letter-spacing:5px

overflow:hidden

clear:both}

说明.list

li

{li宽度200px

文字居中

li高度22px

行高22px

字间距5px

超出部份隐藏

清除}