直接用样式一步到位还无法实现空心的三角形，你姑且使用一大一小的三角形的实现假空心效果好了，我大概写一个方法，如下
<style type="text/css">body{ margin:0 padding:0}
#triangle-bottomright {
position:absolute
left:0px
top:0px
width: 0
height: 0
border-bottom: 100px solid red
border-left: 100px solid transparent
padding:2px
}
#triangle-bottomright02 {
position:absolute
left:6px
top:6px
width: 0
height: 0
border-bottom: 96px solid white
border-left: 96px solid transparent
}
</style>
</head>
<body>
<div id="triangle-bottomright"></div>
<div id="triangle-bottomright02"></div>
</body>
通过设置 宽和高为0 ，改变 border-color 属性即可实现三角形效果。
在当前的三角形后面添加一个一个实心三角形，然后将这个三角形绝对定位到当前三角行的位置切割。
纯css应该是不行了 因为项目符号样式 list-style-type 没有提供三角符号的取值list-style-type 的取值如下：disc : CSS1 默认值。实心圆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 ) 括号里填你的项目符号图片的地址 也很方便的
