CSS列表样式属性.docxVIP

CSS列表样式属性列表样式类型属性(list-style-type)这个属性用来设定列表项标记(list-item marker)的类型。有以下值：disc (缺省值，黑圆点) circle (空心圆点) square (小黑方块) decimal (数字排序) lower-roman (小写罗马字排序) upper-roman (大写罗马字排序) lower-alpha (小写字母排序) upper-alpha (大写字母排序) none (无列表项标记) 以disc,circle,square,none作为列表项标记的列表示例htmlheadtitle列表样式类型 list-style-type/titlestyle type=text/cssul.disc {list-style-type: disc}ul.circle {list-style-type: circle}ul.square {list-style-type: square}ul.none {list-style-type: none}/style/headbody bgcolor=#779999ul class=discli肉类/lili蔬菜/lili水果/li/ulul class=circleli肉类/lili蔬菜/lili水果/li/ulul class=squareli肉类/lili蔬菜/lili水果/li/ulul class=noneli肉类/lili蔬菜/lili水果/li/ul/body/html以decimal,lower-roman,upper-roman,lower-alpha,upper-alpha作为列表项标记的列表示例htmlheadtitle列表样式类型 list-style-type/titlestyle type=text/cssol.decimal {list-style-type: decimal}ol.lower-roman {list-style-type: lower-roman}ol.upper-roman {list-style-type: upper-roman}ol.lower-alpha {list-style-type: lower-alpha}ol.upper-alpha {list-style-type: upper-alpha}/style/headbody bgcolor=#779999ol class=decimalli肉类/lili蔬菜/lili水果/li/olol class=lower-romanli肉类/lili蔬菜/lili水果/li/olol class=upper-romanli肉类/lili蔬菜/lili水果/li/olol class=lower-alphali肉类/lili蔬菜/lili水果/li/olol class=upper-alphali肉类/lili蔬菜/lili水果/li/ol/body/html列表样式位置属性(list-style-position)列表样式位置属性(list-style-position)有两个值：outside (以列表项内容为准对齐) inside (以列表项标记为准对齐)演示示例htmltitle列表样式位置 list-style-position/titleheadstyle type=text/css.u1 {list-style-position:outside}.u2 {list-style-position:inside}/style/headbody bgcolor=#779999ul class =u1li芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐/lili木子美/lili竹影青瞳/lili流氓燕/li/ulul class =u2li芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐芙蓉姐姐/lili木子美/lili竹影青瞳/lili流氓燕/li/ul/body/html列表样式图片属性(list-style-image)列表项标记可以用图片来表示，用列表样式图片属性(list-style-image)来设定图片。示例代码如下：ul {list-style-image: url(../images/css_tutorials/dot02.gif)}演示示例htmltitle列表样式图片 list-style-image/titleheadstyle type=text/cssul {list-style-image: url(../images/css_tutorials/dot02.gif)}/style/headbody bgcolor=#779999ulli芙蓉姐姐