background-size: 6px, auto, contain background-size: inherit 2、<长度值>:成对出现如200px 50px,将背景图片宽高依次设置为前面两个值,当设置一个值时,将其作为图片宽度值来等比缩放; 3、<百分比>:0%~100%之间的任何值,将背景图片宽高依次设置为所在元素宽高乘以前面百分比得出的数值,当设置一个值时同...
background-size: 100% auto; //这个属性可以自己试验一下。 /* cover:图片始终填充满容器,且保证长宽比不变。图片如果有超出部分,则超出部分会被隐藏。 */ background-size: cover; /* contain:将图片完整地显示在容器中,且保证长宽比不变。可能会导致容器的部分区域为空白。 */ background-size: contain;...
length:具体数值,用于设置背景图片的具体宽度和高度。例如:background-size: 100px 200px;将设置背景图片的宽度为100像素,高度为200像素。如果只设置一个值,则第二个值会被设置为 “auto”。 percentage:百分比,用于以父元素的百分比来设置背景图片的宽度和高度。例如:background-size: 50% 50%;将设置背景图片的...
使用background-size属性设置语法:background-size: length|percentage|cover|contain;length: 设置背景图像的高度和宽度。 第一个值设置宽度,第二个值设置高度。 如果只设置一个值,则第二个值会被设置为 “auto”。 (会显示整个图片)percentage: 以父元素的百分比来设置背景图像的宽度和高度。 第一...
1 第一步,在HBuilder编辑工具里新建静态页面backgroundSize.html,如下图所示:2 第二步,向主体body元素里插入一个div,设置id值为bg,如下图所示:3 第三步,分别设置body和div的样式属性,div元素的背景是一张图片,如下图所示:4 第四步,添加background-size属性,设置值为cover,如下图所示:5 第五步...
background-size设置对象的背景图像的尺⼨⼤⼩ <length>⽤长度值指定背景图像⼤⼩,不允许负值;=>background-size:X轴尺⼨⼤⼩ Y轴尺⼨⼤⼩ <percentage>⽤百分⽐指定背景图像⼤⼩,不允许负值;auto背景图像的真实⼤⼩;cover将背景图像等⽐缩放到完全覆盖容器,背景图像有可能超出容器;...
background-size: auto ||<length> ||<percentage> || cover || contain 取值说明: 1、auto:此值为默认值,保持背景图片的原始高度和宽度; 2、<length>此值设置具体的值,可以改变背景图片的大小; 3、<percentage>此值为百分值,可以是0%〜100%之间任何值,但此值只能应用在块元素上,所设置百分值将使用背景...
1. 背景尺寸属性 在CSS中,`background-size`属性用于设置背景图片的尺寸。你可以使用这个属性让背景图片随着容器的高度自适应。2. 值的选择 要使背景随着容器的高度自适应,可以选择百分比值或者“auto”关键字。例如,`background-size: 100% auto;`表示背景图的宽度为其原始尺寸的100%,...
/* background-size: 50% ; */ /* 如果只设置一个值,则第二个值会被设置为 "auto"。 */ /* background-size: contain; */ /* 把背景图像扩展至足够大,以使背景图像完全覆盖背景区域。 背景图像的某些部分也许无法显示在背景定位区域中。 */ ...
background-size的设置方法:设置背景图片高度和宽度(10px 30px)。第一个值设置宽度,第二个值设置的高度。如果只给出一个值,第二个是设置为 auto(自动)。将计算相对于背景定位区域的百分比(30% 30%)。第一个值设置宽度,第二个值设置的高度。如果只给出一个值,第二个是设置为"auto(自动)"...