CSS高级特性
盒子新特性:
盒子阴影 box-shadow
SRE实战 互联网时代守护先锋,助力企业售后服务体系运筹帷幄!一键直达领取阿里云限量特价优惠。属性:box-shadow 作用:设定一个盒子的阴影效果
形式: box-shadow: 水平偏移值 垂直偏移值 [模糊值] [外延值] [颜色] [inset]
说明:
1. 至少设置两个长度值,分别表示阴影的水平偏移量和垂直偏移量,可以为负。
2. 模糊值是设定阴影的模糊效果的宽度,可以不设置,则默认值为0,
3. 外延值是设定阴影再"扩大"的宽度,可以不设置,则默认为0
4. insert表示设置"内阴影",可以不设置,则默认为外阴影。
二. 圆角边框 border-radius
属性: border-radius 用于设定一个盒子的圆角特性
形式:border-radius: 水平圆角半径[/垂直圆角半径]
说明:半径设置可以提供四个值,垂直半径可以省略
三. 图像边框 border-image
主要属性:
border-image-source : 设置作为边框背景的图片源。
border-image-slice: 设置要将边框背景图片进行"切割"的分割方式。不带单位,1-4个值
border-image-width 设置图片边框的宽度,也可以设定1-4个值,通常设定为auto
border-image-repeat: 设置边框背景的填充方式,可以设定2个值,表示横向和纵向
四: 背景新特性
background-attachment : 设置背景图像的滚动属性特性
scroll(相对盒子固定) local(内容滚动) fixed(浏览器固定)
background-origin: 设置背景图像的参考原点(位置) border-box padding-box centent-box
background-clip: border-box padding-box centent-box
background-size: 值1,值2
