纯 CSS border 用法实例之四:三角形对角线,斜边都是依靠原来盒子的边,还有另外一种形式就是斜边在盒子的对角线上,保留其中一种颜色,就可以得到斜边在对角线上的三角形了,多个这样的三角形通过设置边框大孝颜色、拼凑起来可以形成任意形状的三角形。想一想,用它是不是可以做成气泡提示呢? 演示: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <HEAD> <TITLE>CSS border 三角形</TITLE> <style> #test5 { height:0; width:0; overflow: hidden; font-size: 0; line-height: 0; border-color:#FF9600 #3366ff transparent transparent; border-style:solid solid dashed dashed; border-width:40px 40px 0 0 ; } </style> </HEAD> <BODY> <div id="test5"></div> </BODY> </HTML> <br /><center>如不能显示效果,请按Ctrl+F5刷新本页,更多网页代码:<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>提示:可修改后代码再运行! 文章导航 使用fieldset标签结合CSS Lable实现表单的布局纯 CSS border 用法举例之三:实现三角形图形