欢迎访问 生活随笔!

生活随笔

当前位置: 首页 >

css的对号错号,也就是勾和叉

发布时间:2023/12/15 103 生活家
生活随笔 收集整理的这篇文章主要介绍了 css的对号错号,也就是勾和叉 小编觉得挺不错的,现在分享给大家,帮大家做个参考.
 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>
17         <a href=""></a>
18         <b></b>
19     </div>
20 </body>
21 </html>

上面是代码,下面是运行自后的截图

总结

以上是生活随笔为你收集整理的css的对号错号,也就是勾和叉的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。