CSS 制作平行四边形

更新时间:2018-11-26 14:43:40

css做了个平行四边形!!!!!




HTML:
<div class="menu">
    <ul>
    <li><a href="/">网站首页</a></li>
    <li><a href="/news/">行业资讯</a></li>
</ul>
</div>




CSS:

.menu li:before{
            content: '';
            position: absolute;
            top: 0; right: 0; bottom: 0; left: 0;
            transform: skewX(-45deg);
            z-index: -1;
            background:#5a5a5a;
            width:109px; 
            line-height: 40px;
        }