码迷,mamicode.com
首页 > Web开发 > 详细

html css 设置上下左右三角形箭头

时间:2015-08-04 18:35:00      阅读:147      评论:0      收藏:0      [点我收藏+]

标签:

<html>
    <head> 
        <style>
            .up {
                height:0;
                width:0;
                border-top:20px solid black;
                border-left:20px solid transparent;
                transform:rotate(-45deg); 
            }
            .down {
                height:0;
                width:0;
                border-bottom:20px solid black;
                border-right:20px solid transparent;
                transform:rotate(-45deg); 
            }
            .left {
                height:0;
                width:0;
                border-bottom:20px solid black;
                border-right:20px solid transparent;
                transform:rotate(45deg); 
            }
            .right {
                height:0;
                width:0;
                border-top:20px solid black;
                border-left:20px solid transparent;
                transform:rotate(45deg); 
            }
        </style> 
    </head> 
    <body> 
        <div class="up"></div>
    </body>
</html>

 

html css 设置上下左右三角形箭头

标签:

原文地址:http://www.cnblogs.com/pumushan/p/4702530.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!