<style> .triangle{ width: 0; height: 0; border-top: 50px solid blue; border-right: 50px solid red; border-bottom: 50px solid green; border-left: 50px solid yellowgreen; } .triangle1{ width: 0; height: 0; border-bottom: 50px solid red; border-left: 50px solid transparent; border-right: 50px solid transparent; }</style><body> <div class="triangle"></div> <div class="triangle1"></div></body>
Copy the code
trapezoidal
<style>
.trapezoid{ width: 100px; height: 0; border-top: 90px solid green; border-left: 40px solid transparent; border-right: 40px solid transparent;
<style>
<body> <div class="trapezoid"></div></body>
Copy the code