html5 三角形
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
body,div{padding: 0;margin:0;}
body{background-color: #7ab575;}
.a{
margin-left:82px;
height:0;
width:0;
border-width:8px;
border-style:solid;
border-color:transparent transparent #fff transparent;
}
.b{width:140px;background-color: #fff; color:#999; padding:16px;font-size: 12px;}
.ab{border:1px solid red; width:172px;}
</style>
</head>
<body>
<div class="ab">
<div class="a"></div>
<div class="b">按时考勤上课，不缺课，每缺一节课 = 实际上课次数总课数*100计算。</div>
</div>
</body>
</html>