css利用border设置小三角 

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <style>
 7             
 8             .box1{
 9                 width: 0px;
10                 height: 0px;
11                 border: 15px red solid;
12                 /* 为四条边设置一个不同的颜色 */
13                 border-color: transparent transparent red transparent;
14                  /* 边框的交界是斜线 */
15                  
16                  border-top: none;
17                  
18             }
19             
20         </style>
21     </head>
22     <body>
23         <div class="box1"></div>
24     </body>
25 </html>

 

posted @ 2020-04-09 14:26  全情海洋  阅读(627)  评论(0)  编辑  收藏  举报