css-渐变

141 阅读1分钟

线性渐变

background-image: linear-gradient

从左到右的线性渐变{ height: 200px; background-image: linear-gradient(to right, red , yellow); }


径向渐变

background-image: radial-gradient(red, yellow, green);

颜色节点不均匀分布的径向渐变:{ background-image: radial-gradient(red 5%, yellow 15%, green 60%); }


圆形的径向渐变

background-image: radial-gradient(circle, red, yellow, green);

shape 参数定义了形状。它可以是值 circle 或 ellipse。其中,circle 表示圆形,ellipse 表示椭圆形。默认值是 ellipse。


盒子阴影

box-shadow 属性用于向盒子添加一个或多个阴影效果。 offset-x:阴影的水平偏移量。正数向右偏移,负数向左偏移。 offset-y:阴影的垂直偏移量。正数向下偏移,负数向上偏移。 blur:阴影模糊度,不能取负数。 spread:阴影大小。正数阴影扩大(阴影大小大于盒子大小),负数阴影缩小(阴影大小小于盒子大小),0阴影与盒子同等大小。 inset:表示添加内阴影,默认为外阴影。


list-style-type 属性

none 无标记。 disc 默认。标记是实心圆。 circle 标记是空心圆。 square 标记是实心方块。 decimal 标记是数字。