网站开发进阶(五十七)纯CSS画的基本图形(矩形、圆形、三角形、多边形、爱心、八卦等)
正方形 #square { width: 100px; height: 100px; background: red; } 长方形 #rectangle { width: 200px; height: 100px; background: red; } 圆形 .circle { width: 100px; height: 100px; background: red; border-radius: 50px; } 椭圆 .oval { width: 200px; height: 100px; background: red; border-radius: 100px / 50px; } 上三角 .triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; } 下三角 #triangle-down { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-top: 100px solid red; } 左上三角