background 您所在的位置:网站首页 a4大小背景图片一样吗 background

background

2023-06-19 03:51| 来源: 网络整理| 查看: 265

值,指定背景图片大小,不能为负值。

值,指定背景图片相对背景区(background positioning area)的百分比。背景区由background-origin设置,默认为盒模型的内容区与内边距,也可设置为只有内容区,或者还包括边框。如果attachment 为fixed,背景区为浏览器可视区(即视口),不包括滚动条。不能为负值。

auto

以背景图片的比例缩放背景图片。

cover

缩放背景图片以完全覆盖背景区,可能背景图片部分看不见。和 contain 值相反,cover 值尽可能大的缩放背景图像并保持图像的宽高比例(图像不会被压扁)。该背景图以它的全部宽或者高覆盖所在容器。当容器和背景图大小不同时,背景图的 左/右 或者 上/下 部分会被裁剪。

contain

缩放背景图片以完全装入背景区,可能背景区部分空白。contain 尽可能的缩放背景并保持图像的宽高比例(图像不会被压缩)。该背景图会填充所在的容器。当背景图和容器的大小的不同时,容器的空白区域(上/下或者左/右)会显示由 background-color 设置的背景颜色。

位图一定有固有尺寸与固有比例,矢量图可能两者都有,也可能只有一个。渐变视为只有固有尺寸或者只有固有比例的图片。

备注: This behavior changed in Gecko 8.0. Before this, gradients were treated as images with no intrinsic dimensions, with an intrinsic proportion identical to that of the background positioning area.

由 -moz-element (en-US) 生成的背景图片,(which actually match an element) are currently treated as images with the dimensions of the element, or of the background positioning area if the element is SVG, with the corresponding intrinsic proportion.

备注: This is not the currently-specified behavior, which is that the intrinsic dimensions and proportion should be those of the element in all cases.

背景图片大小计算:

如果指定了 background-size 的两个值并且不是auto:

背景图片按指定大小渲染。

contain 或 cover:

保留固有比例,最大的包含或覆盖背景区。如果图像没有固有比例,则按背景区大小。

auto 或 auto auto:

图像如果有两个长度,则按这个尺寸。如果没有固有尺寸与固有比例,则按背景区的大小。如果没有固有尺寸但是有固有比例,效果同 contain。如果有一个长度与比例,则由此长度与比例计算大小。如果有一个长度但是没有比例,则使用此长度与背景区相应的长度。

一个为 auto 另一个不是 auto:

如果图像有固有比例,则指定的长度使用指定值,未指定的长度由指定值与固有比例计算。如果图像没有固有比例,则指定的长度使用指定值,未指定的长度使用图像相应的固有长度,若没有固有长度,则使用背景区相应的长度。

注意,对于没有固有尺寸或固有比例的矢量图不是所有的浏览器都支持。特别注意测试 Firefox 7- 与 Firefox 8+,以确定不同之处能否接受。



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有