添加背景属性
背景剪辑
背景定向
背景大小
CSS的一般背景属性
背景重复
背景图像
边框样式
边框-半径
边框图像
新背景属性:
背景剪辑
指定显示背景的范围
属性值:
边框:边框中的背景。 包括边框(默认)
填充- box :填充以内的背景,包括填充
内容- box :内容内的背景。 包括内容
背景- origin :
开始显示的位置一般在以图像为背景时使用
属性值:
边框:从边框显示
填充盒:从填充中显示
内容盒:从内容中显示
背景大小:
设置背景图像的宽度和高度
属性值:
自动:保持原始高度和宽度
length:后面可以有两个数字:宽度和高度。 只写一个数值,就会高度适应
percentage :后跟两个数字:宽度和高度(百分比)。 只写一个数值,就会高度适应
cover :放大到满满的容器,适合比容器小的照片
contain :适合缩小到满容器、大于容器的图像
后台位置
属性设置背景图像的开始位置。
背景定位:中心;
CSS常规背景属性:
背景重复:
图像重复
背景图像:
一个元素可以有一个或多个背景图像
写法:
背景影像3360 URL (“123.jpg”)、URL (“124.jpg”)、URL (“125.jpg”);
添加多个图像时重叠,第一张从特别的上往下依次
边框样式:
边框-半径
属性介绍:
后面有两个值时,第一个表示左上和右下角度,第二个表示右上和左下角度
为一个值时,为所有角的角度
也可以分别设定左上左下右上右下的属性
例如,左上角的属性如下所示:
边界顶端左半径
边框图像
图像边框(类似于剪切图像) ) ) )。
写法:
border-image : URL (' ./image/123.jpg ' ) 100;
border-image : URL (' ./image/123.jpg ' ) 100100100;
上面两行代码是等效的
第二行代码后面的四个数字分别是上、右、下和左边距
border-image : URL (' ./image/123.jpg ' ) 100/100px repeat repeat;
“/”后面的三个参数分别是边框宽度、上下图像填充方法和左右图像填充方法。 repeat拼贴、拉伸(默认样式)和round也是拼贴。 不同的是,如果最后一个图像没有全部显示,则不显示,而是放大前一个图像