ul是定义无序列表的样式
li是列表内行的样式
在HTML代码中列表是这样的
<ul>
<li>列表一</li>
<li>列表二</li>
</ul>
只要在<ul>或者<ol>里定义CSS样式list-style-type或者设置<li>的list-style-type的就可以了。举例:
<ul style="list-style-type:square">
<li>a</li>
<li>b</li>
<li>c</li>
</ul>
原来的点a
点b
点c
就变成 方块a
方块b
方块c
了。
list-style-type可以有以下取值:
取值:disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | armenian | georgian | lower-alpha | upper-alpha | none | inherit
disc:点
circle: 圆圈
square: 正方形
decimal: 数字
decimal-leading-zero: 以一个0开头的数字e.g., 01, 02, 03, ..., 98, 99
lower-roman: 小写罗马文字i, ii, iii, iv, v, etc.
upper-roman: 大写罗马文字I, II, III, IV, V, etc.
lower-greek: 小写阿拉伯文字α, β, γ, ...
lower-latin: 小写拉丁文a, b, c, ... z
upper-latin: 大写拉丁文A, B, C, ... Z
armenian: 亚美尼亚数字
georgian: 乔治亚数字an, ban, gan, ..., he, tan, in, in-an, ...
lower-alpha: 小写拉丁文a, b, c, ... z
upper-alpha: 大写拉丁文A, B, C, ... Z
none: 无(取消所有的list样式)
inherit:继承
解决方法一:把li a:link,li a:visited{color:blackfont-family:arial}里面的font-family:arial去掉即可由于font-family:arial的字体高使a高度超出li的高,所以在FF里底边没有了,而ie允许这个错误所以底边还在解决方法二:给a一个高 例:
li a{
text-decoration:none
display:block
background:yellow
padding:6px
line-height:18px
}
解决方法三:给li增加高,并且给a字体高 例:
li{
height:35px
float:left
margin-right:3px
border:1px solid red
}
li a{
text-decoration:none
display:block
background:yellow
padding:6px
line-height:23px
}