先看下我们的html代码,很简单,就是一个div里有一段文字,我们为这个div添加了一个样式 zn
02默认情况下,不加任何样式时,这段文字的间距是很小的,如图
03为了添加文字的间距,我们可以添加letter-spacing的样式,添加一个zn的样式名,样式代码为 letter-spacing: 12px就是每个文字间会有12像素的间距。
04再运行页面,就可以看到效果了。文字间的间距明显加大了。
如何定义字间距?在dw3中css的属性定义对话框(style
definition
for
.style1)的“block”上的“letter
spaceing”属性定义的就
是字间距,它指的是每一个字符之间的额外间距,经长度为单位,正负值均可,当取负值时产生字符挤在一起的效果。下
面代码是一个定义好的字间距css例子:
<!--
.style1
{
letter-spacing:
3px}
-->
可以使用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
超出部份隐藏
清除}