<!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> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>Css三角形</title> </head> <style type="text/css"> .div1,.div2,.div3,.div4{margin:5px; float:left; border-width:20px; border-style: solid; } .div1{ border-color:#fff #fff #fff #F00;} .div2{ border-color:#F00 #fff #fff #fff;} .div3{ border-color:#fff #fff #F00 #fff;} .div4{ border-color:#fff #F00 #fff #fff;} </style> <body> <div class="div1"></div> <div class="div1"></div> <div class="div2"></div> <div class="div2"></div> <div class="div3"></div> <div class="div3"></div> <div class="div4"></div> <div class="div4"></div> </body> </html>