不规则多边形css,css 画多边形、不规则边框

1.画梯形：

width: 200px;

height: 0px;

border-top: 0px;

border-bottom: 70px solid #1E6AA4;

border-right: 50px solid transparent;

border-left: 50px solid transparent;

2.画三角形：

width: 0px;

height: 0px;

border-color: #014F83 transparent;

border-width: 0px 56px 56px 00px;

border-style: solid;

3.不规则边框(用clip-path截图)

如：

.bkml-bottom{

width:50%;

height:50%;

background: #58a;

clip-path:

polygon(0 0, 100% 0%,100% 100%,

70px 100%, 0 calc(100% - 70px));

}

效果图：

效果图汇总：

main

这是个梯形

hello

4.平行四边形、梯形

popup

平行四边形l

我是梯形

平行四边形r