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>

2021-07-11
2022-01-07
2022-01-11
2021-11-20
2021-11-30
2021-10-03
2021-09-07
2022-01-14