css各种图形代码 |css3中的单位

/* 实现一个三角形 */
.triangle {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 100px solid red;
}
/* 实现一个圆形 */
.circle {
width: 50px;
height: 50px;
border-radius: 50%;
background-color: blue;
}
/* 实现一个矩形 */
.rectangle {
width: 100px;
height: 50px;
background-color: green;
}
/* 实现一个直线 */
.line {
width: 200px;
border-bottom: 1px solid black;
}
/* 实现一个梯形 */
.trapezoid {
border-bottom: 100px solid blue;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
height: 0;
width: 100px;
}

以上是CSS中的一些图形代码，例如可以使用border属性创建三角形、圆形、矩形和梯形等形状，还可以使用border-bottom来创建直线。这些代码可以很方便地应用于网页中的设计和排版中，让页面更加美观。