css制作三角形

最新推荐文章于 2021-03-12 19:56:58 发布

diue79978

最新推荐文章于 2021-03-12 19:56:58 发布

阅读量62

点赞数

原文链接：http://www.cnblogs.com/LCH-M/p/9335269.html

版权

这个图形忘了在哪里见过的，不过见过有一些网站有这种图形。我这里做了一个简单的练习，希望帮到有需要的人。

代码：

<!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>

View Code

转载于:https://www.cnblogs.com/LCH-M/p/9335269.html

diue79978

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
css制作三角形

这个图形忘了在哪里见过的，不过见过有一些网站有这种图形。我这里做了一个简单的练习，希望帮到有需要的人。代码：<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>图形</title>...
复制链接

扫一扫