html 设置origin,background-origin属性怎么用

CSS3background-origin属性

作用：规定背景图片的定位区域。

说明：设置或检索对象的背景图像计算时的参考原点(位置)。

语法：

background-origin:padding-box|border-box|content-box;

padding-box：背景图像相对于内边距框来定位。

border-box：背景图像相对于边框盒来定位。

content-box：背景图像相对于内容框来定位。

CSS3background-origin属性的使用示例

div

{

border:1pxsolidblack;

padding:35px;

background-image:url('https://img.php.cn/upload/article/000/000/024/5c513adf97e86533.jpg');

background-repeat:no-repeat;

background-position:left;

}

#div1

{

background-origin:border-box;

}

#div2

{

background-origin:content-box;

}

background-origin:border-box:

这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。

html 设置origin,background-origin属性怎么用相关推荐

css3-background clip 和background origin
1.background-origin background-origin 里面有3个参数 : border-box | padding-box | content-box; border-box,p ...
Background 全属性实例图解（10种全）(一)
Background 全属性实例图解(10种全)(一) 本文目录: 一.background属性: (1).属性描述 (2).background属性使用示例 (3).background动画属性 ( ...
background复合属性顺序_background：常用背景属性（复合属性）
定义和用法 background 简写属性在一个声明中设置所有的背景属性. 可以设置如下属性:background-color | 背景颜色 background-position | 背 ...
（15）css常用样式—background背景属性
一.背景属性概述 CSS 中除了布局类属性,还需要添加一些背景类的内容进行页面的修饰,从而让网页变得更加的美观. CSS 中通过 background 属性来设置背景,它是一个综合属性,可以拆分成多 ...
[读码时间] css函数设置读取对象的属性
说明:代码取自网络,注释为笔者学习时添加! <!DOCTYPE html> <html> <head><meta charset="utf-8&qu ...
background系列属性
1.background-color背景颜色属性 ①颜色表示方法英语单词:red blue purple skyblue. rgb:r代表红色 g代表绿色 b代表蓝色也 ...
【前端小点】CSS之background背景属性详解
本篇文章我们将一起展开来看css的background背景属性. 一.结构创建DIV <div class="div1">1 </div> 样式 widt ...
background 背景属性详解
background 背景属性我们知道元素有前景色color,与之对应的还有背景色,通过background我们可以为元素添加实色(background-color)和任意多个背景图片(backgr ...
css如何利用transparent属性设置透明度？transparent属性绘制各种三角形
想到用css设置元素透明度,大家的第一反应会是:用Opacity属性来设置透明度,其实在css中还有其他设置透明度的方法.本章给大家介绍用transparent属性设置透明度,以及用transpare ...
015day(css控制单词换行的属性，css设置中英文大小写的属性，背景渐变)
一.css控制单词换行的属性 1.word-break自己决定自动换行的处理方法 ①word-break:normal:使用浏览器默认的换行规则.(英文) ②word-break:keep-all:不 ...

html 设置origin,background-origin属性怎么用

html 设置origin,background-origin属性怎么用相关推荐

最新文章

热门文章