list-style-type所使用的小按钮与LI正文间的间距、

2017-02-25  本文已影响0人  tobyDing

说起列表标签li的运用,也许大家都挺熟悉,但是,关于list-style-type所使用的小按钮与LI正文间的间距、颜色、大小控制也许很多人都不是特别熟悉,这里就常见用法,做简单总结:

list-style-type    小按钮的类型

list-style-position 小按钮的位置(列表里inside和列表外outside)

list-style-image 小按钮用图片代替

我们常见的列表用法如下例子:

示例代码

如果调整小按钮颜色和大小,只需要相应的在ul标签中改变color和font-size就行了;

这里,如果想改变小按钮和Li之间的距离,用自动生成的小按钮无法做到;

另外,如果项目中要求,小按钮和li中的文字颜色不一样的话,自动生成的li也很难做好,

这时,我们有必要引入背景图片,在li上设置padding-left,然后再引入背景图片

上一篇下一篇

猜你喜欢

热点阅读