background-clip: border-box; //默认值,裁剪超出盒子边框的背景图片 background-clip: padding-box; //裁剪超出盒子内边距的背景图片 background-clip: content-box; //裁剪超出盒子内容的背景图片 3==> 背景属性的简写 background:pink(背景色) url(背景图) no-repeat 图片位置(center)/图片的尺寸(cover) ...
background-origin 属性规定背景图片的定位区域。 背景图片可以放置于 content-box、padding-box 或 border-box 区域。 实例 在content-box 中定位背景图片: .wrap{background:url(bg_flower.gif);background-repeat:no-repeat;background-size:100%100%;-webkit-background-origin:content-box;/* Safari */back...
background-Origin属性指定background-position属性应该是相对位置。注意如果背景图像background-attachment是"固定",这个属性没有任何效果。默认值: padding-box 继承: no 版本: CSS3 JavaScript 语法: object object.style.backgroundOrigin="content-box"语法background-origin: padding-box|border-box|content-box;...
第一个例子中的background-origin属性设置为:border-box。可以看到透明的红色边框下面的背景图像。 这个例子中的background-origin属性设置为:border-box。可以看到透明的红色边框下面的背景图像。 第二个例子中的background-origin属性设置为:padding-box。这是默认值。可以看到背景图像的原点(左上角位置)从paading box...
CSS3 background-origin 属性实例 内容框相对定位的背景图片: div { background-image:url('smiley.gif'); background-repeat:no-repeat; background-position:left; background-origin:content-box; } 尝试一下 » 浏览器支持表格中的数字表示支持该属性的第一个浏览器版本号。属性 background-origin 4.0 ...
css中background-origin属性的使用 background-origin用来规定元素背景图像的相对定位位置,它有三个属性值: 1、border-box border-box表示元素背景图像相对于border区域开始定位。 代码如下: 1 2 3 4 5 6 7 8 9 10 11 12 <!doctypehtml> *{
Background-Origin 在Background-Origin属性出现之前,当我们向元素添加背景图像时,图像位置从元素中填充的左上角开始。 打印默认背景原点位置的屏幕,如果background-position设置为左(left)0,上(top)0 ,您可以在填充区域(红点)处看到背景图像。 代码如下: ...
background-origin属性规定背景图的定位区域,有三个值: border-box:背景图从外边框的左上角开始,即包括边框部分; padding-box:背景图从内边距的左上角开始,即不包括上和左边框部分,图片足够大会包括右和下边框部分; content-box:背景图从内容框的左上角开始; ...
【多选题】background-origin属性可以自行定义背景图像的相对位置,它的可取属性值包括 ()A. padding-box(背景图像相对于内边距区域来定位) B
IE9+、Firefox、Opera、Chrome 和 Safari 支持 background-origin 属性。语法返回backgroundOrigin 属性:object.style.backgroundOrigin 设置backgroundOrigin 属性:object.style.backgroundOrigin="padding-box|border-box|content-box|initial|inherit" 属性值