新的UI方案
新增属性
box-shadow 盒阴影
- 关键字(内 外阴影)
- length(x轴的偏移量)
- length(y轴的偏移量)
- length(模糊程度)
- length(阴影面积)
- color(阴影颜色)
text-shadow 文字阴影
- length(x轴的偏移量)
- length(y轴的偏移量)
- length(模糊程度)
- color(阴影颜色)
filter 属性定义元素的视觉效果(如模糊和饱和度)
- blur(px) 对图像应用模糊效果。较大的值将产生更多的模糊。
- brightness(%) 使用百分比值(例如 75%)的滤镜,也接受该值是十进制(例如 0.75)
text-stroke 文字描边
- webkit-text-stroke:4px pink
text-overflow 超出省略号
- ellipsis
box-reflect 倒影
- -webkit-box-reflect:below
resize 属性规定是否可由用户调整元素的尺寸。
- none 用户无法调整元素的尺寸。
- both 用户可调整元素的高度和宽度。
- horizontal 用户可调整元素的宽度。
- vertical 用户可调整元素的高度。
box-sizing 定义盒模型
- content-box 标准盒模型,宽度包括内边距和边框
- border-box 怪异合模型,宽度不包括内边距和框架,方便计算
background背景
- background-size 规定背景图像的尺寸。
- background-position 控制背景图片在背景区域中的位置
- background-attachment 设置背景图像是否固定或者随着页面的其余部分滚动。
- background-origin 属性规定 background-position 属性相对于什么位置来定位
- background-clip 属性规定背景的绘制区域。