1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>勾和叉</title> 8 <style type="text/css"> 9 a{ display: inline-block; width: 10px;height:5px; background: red;line-height: 0;font-size:0;vertical-align: middle;-webkit-transform: rotate(45deg);} 10 a:after{content:'/';display:block;width: 20px;height:5px; background: red;-webkit-transform: rotate(-90deg) translateY(-50%) translateX(50%);} 11 b{ display: inline-block; width: 20px;height:5px; background: red;line-height: 0;font-size:0;vertical-align: middle;-webkit-transform: rotate(45deg);} 12 b:after{content:'/';display:block;width: 20px;height:5px; background: red;-webkit-transform: rotate(-90deg);} 13 </style> 14 </head> 15 <body> 16 <div style="padding:50px;"> 17 <a href=""></a> 18 <b></b> 19 </div> 20 </body> 21 </html>
上面是代码,下面是运行自后的截图