直接用样式一步到位还无法实现空心的三角形，你姑且使用一大一小的三角形的实现假空心效果好了，我大概写一个方法，如下
<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 属性即可实现三角形效果。
在当前的三角形后面添加一个一个实心三角形，然后将这个三角形绝对定位到当前三角行的位置切割。
