circle : CSS1 空心圆
square : CSS1 实心方块
decimal : CSS1 阿拉伯数字
lower-roman : CSS1 小写罗马数字
upper-roman : CSS1 大写罗马数字
lower-alpha : CSS1 小写英文字母
upper-alpha : CSS1 大写英文字母
none : CSS1 不使用项目符号
armenianl : CSS2 未支持。传统的亚美尼亚数字
cjk-ideographic : CSS2 未支持。浅白的表意数字
georgian : CSS2 未支持。传统的乔治数字
lower-greek : CSS2 未支持。基本的希腊小写字母
hebrew : CSS2 未支持。传统的希伯莱数字
hiragana : CSS2 未支持。日文平假名字符
hiragana-iroha : CSS2 未支持。日文平假名序号
katakana : CSS2 未支持。日文片假名字符
katakana-iroha : CSS2 未支持。日文片假名序号
lower-latin : CSS2 未支持。小写拉丁字母
upper-latin : CSS2 未支持。大写拉丁字母。 你可以用调用你的三家符号的图片作为项目符号呀list-style-image : url ( url ) 括号里填你的项目符号图片的地址 也很方便的
其实很简单HTML代码:
[html] view plain copy
<div class="sanjiao"></div>
CSS代码:
[css] view plain copy
.sanjiao {
width: 0
height: 0
overflow: hidden
border-width: 10px
border-color: transparent transparent #000 transparent
border-style: dotted dotted solid dotted
}
其原理就是给元素加一个比较大的边框,箭头的方向就是border-color四个参数的方向(上、右、下、左),箭头指向那一边就给哪一边设置颜色,其他边透明。
这样就很方便的做了一个小的三角形图标。
其中需要注意的地方是:由于IE6不支持overflow属性,会将其他边框也显示出来,所以将不需要显示的边框的border-style属性设置为dotted就可以完美兼容IE6啦!