假设我有一个 div:
div {
height: 100px;
width: 500px;
background: blue;
margin: 0 auto;
}
我希望它变成两种模式 - skew到每一边-
这是基本形式 - http://jsfiddle.net/urielz/neybabgj/
如何获得以上两种形式?
更新:
如果需要使用 JavaScript - 那就去做吧。
最佳答案
CSS
div {
height : 100px;
width : 500px;
background : blue;
margin : 10px auto;
position: relative;
}
div:first-child:before {
position: absolute;
top:0;
right:100%;
width:0;
height:0;
content:'';
border:50px solid blue;
border-top-color:transparent;
border-left-color:transparent;
}
div:nth-child(2):after {
position: absolute;
top:0;
left:100%;
width:0;
height:0;
content:'';
border:50px solid blue;
border-bottom-color:transparent;
border-right-color:transparent;
}
关于javascript - 如何倾斜 div 的一侧,然后复制它并倾斜另一侧?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25387897/