这个图形忘了在哪里见过的,不过见过有一些网站有这种图形。我这里做了一个简单的练习,希望帮到有需要的人。
代码:
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>图形</title> <style type="text/css"> #demo{ width:100px; height:100px; background-color:#fff; border: 2px black solid; position: relative; } #demo:after{ content: ""; position: absolute; top:30px; left: 88%; width: 20px; height: 20px; border:2px solid black; transform: rotate(45deg); background: white; border-color: black black transparent transparent; //border: 12px solid transparent; //border-left-color: #fff; } </style> </head> <body> <div id="demo"></div> </body> </html>