html如何让div⼀条边斜着，如何在CSS中创建带有边框的倾斜
标签？html如何下载
你可以尝试这种⽅法：
jsFiddle
⽽不是使⽤边框创建倾斜效果，我使⽤：after伪元素来创建它.这允许我在其周围设置边框.然后我使⽤：before伪元素来隐藏我不想看到的边框. CSS中的循环2px派⽣⾃边框宽度值.
CSS
.tab:before {
height: 50px;
width: 10px;
display: block;
content:" ";
background-color: #FFF;
position: absolute;
right: -2px;
top: -2px;
border-top: 2px solid blue;
border-bottom: 2px solid blue;
}
.tab {
height: 50px;
width: 150px;
border-radius: 10px 10px 0px 0px;
background-color: #FFF;
position: relative;
border: 2px solid blue;
}
.tab:after {
display: block;
content:" ";
width: 100px;
height: 50px;
top: -2px;
background-color: #FFF;
position: absolute;
right: -29px;
transform:skewX(45deg);
-ms-transform:skewX(45deg);
-webkit-transform:skewX(45deg); border: 2px solid blue;
z-index: -1;
}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。