css 常用特殊形状 |css获取系统时间源码

css位置垂直，hetml流动海报css，css动态光圈特效，css如何相对同级元素，css实现9宫格布局，华为css四线堆叠，css获取系统时间源码 css 常用特殊形状 |css获取系统时间源码

1. 圆形和椭圆形

/* 圆形 */
border-radius: 50%;
/* 椭圆形 */
border-radius: 50% / 30%;

2. 三角形

/* 向上的三角形 */
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 100px solid red;
/* 向下的三角形 */
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 100px solid red;
/* 向左的三角形 */
border-top: 50px solid transparent;
border-right: 100px solid red;
border-bottom: 50px solid transparent;
/* 向右的三角形 */
border-top: 50px solid transparent;
border-left: 100px solid red;
border-bottom: 50px solid transparent;

3. 菱形

width: 100px;
height: 100px;
transform: rotate(45deg);
background: red;

4. 梯形

width: 200px;
height: 0px;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 100px solid red;

以上便是CSS中使用较为广泛的一些特殊形状的方法。它们可以为你的网页增色添彩，让页面更具吸引力！