background-origin:指定绘制背景图片的起点。

background-clip:是对背景图片的剪裁,指定背景图片的显示范围。

1、background-origin:padding  || border || content(旧版本);padding-box || border-box || content-box (新版本);

  eg:padding,则从padding外边缘开始定位;同理,其他也是从外边缘起始定位;

2、background-clip:padding  || border || content(旧版本);padding-box || border-box || content-box (新版本);

  eg:padding,则从padding外边缘开始向外裁剪,只显示padding(包括padding)之内的图片;

 

background-clip 默认类似于 background-clip:border。
background-origin 默认类似于 background-origin:padding。

background-clip 和 background-origin 的区别的更多相关文章

  1. css3-background clip 和background origin

    1.background-origin background-origin 里面有3个参数 : border-box | padding-box | content-box; border-box,p ...

  2. arcgis raster clip and mask difference 栅格 提取 clip 和 mask 方法的区别

    建议使用 数据管理工具下的此工具进行操作: 在选择参数时,注意做如下选择,可以保证栅格不会轻微错开: 也就是勾选第一个,而不勾选第二个 看看效果,使用mask得到的裁剪结果,注意有错开现象: 使用cl ...

  3. git merge origin master git merge origin/master区别

    git merge origin master //将origin merge 到 master 上 git merge origin/master //将origin上的master分支 merge ...

  4. compass模块

    Compass核心模块Reset :重置CSS模块 @import "compass/reset" Layout :页面布局的控制能力 @import "compass/ ...

  5. CSS3详解:background

    CSS3对于background做了一些修改,最明显的一个就是采用设置多背景,不但添加了4个新属性,并且还对目前的属性进行了调整增强. 1.多个背景图片 在css3里面,你可以再一个标签元素里应用多个 ...

  6. css2和CSS3的background属性简写

    1.css2:background:background-color || url("") || no-repeat || scroll || 0 0;  css3:  backg ...

  7. CSS3中background属性的调整

    CSS3对于background做了一些修改,最明显的一个就是采用设置多背景,不但添加了4个新属性,并且还对目前的属性进行了调整增强. 1.多个背景图片 在css3里面,你可以再一个标签元素里应用多个 ...

  8. 第5章 css与背景相关的样式background

    background-origin 设置元素背景图片的原始起始位置. 语法: background-origin : border-box | padding-box | content-box; 参 ...

  9. css background 背景知识详解

    background 背景属性 我们知道元素有前景色color,与之对应的还有背景色,通过background我们可以为元素添加实色(background-color)和任意多个背景图片(backgr ...

  10. Android background tint颜色渲染

    该篇文章主要是讲Android颜色渲染,首先先来看看PorterDuff,对绘图非常重要. PorterDuff的由来: 相信大多数人看到这个ProterDuff单词很奇怪了吧,这肿么个意思呢,然后就 ...

随机推荐

  1. Python面向过程编程

    面向过程编程 D:\Document\视频\python20期\day4\视频\面向过程编程 三元表达式示例1 #三元表达式x=10 y=20 res=x if x>y else y print ...

  2. Python关于Pyqt

    参考百度文摘地址: https://jingyan.baidu.com/article/a3761b2ba2b8581576f9aa98.html 1 首先进行安装Pyqt5 pip3 install ...

  3. activity--生命周期总结

    22.Android禁止屏幕旋转 & 旋转屏幕时保持Act内容? 21.旋转屏幕Act执行的生命周期方法? 12.ActA与 ActB互相跳转生命周期情况? 11.Act的生命周期? ==== ...

  4. [图文教程]VS2017搭建opencv & C++ 开发环境

    首先从官网下载OpenCV最新版本 截至我写这文章,4.0已经发布预览版了,不过在这是没有的,只能用3.4.2: https://opencv.org/releases.html 一:安装 安装过程不 ...

  5. ubuntu server cloud img username password

    新安装了OpenStack Queens发现无镜像,蹦蹦跳跳的下载了ubuntu的镜像 网址https://cloud-images.ubuntu.com/ 最好你自己找你想要的,vmdk.ova.i ...

  6. Oracle导出表数据与导入表数据dmp,以及导入导出时候常见错误

    使用DOS 操作界面导出表数据,导入表数据(需要在数据库所在的服务器上边执行) exp UserName/Password@192.168.0.141/orcl   file=d:\xtables.d ...

  7. 【HQL】小技巧

    case1.a与b匹配表保留一条匹配关系 背景:匹配b,b匹配a在同一张表: match_table表为: uid,m_uid 111,222 222,111 需求:只保留一条匹配关系. 结果为: u ...

  8. (9/24) 图片跳坑大战--css分离与图片路径处理

    前言: 在上一节当中,我们把小图片打包成Base64格式(打包到了js当中).我们也算是对webpack对图片的打包有个基本了解. 本节我们准备把css从JavasScript代码中分离出来,这会遇到 ...

  9. Ubuntu 14.04 tomcat配置

    在tomcat-users.xml中添加了以下代码即可 <role rolename="tomcat"/> <role rolename="role1& ...

  10. postgresql数据库varchar、char、text的比较

    名字 描述character varying(n), varchar(n) 变长,有长度限制character(n), char(n) 定长,不足补空白text 变长,无长度限制简单来说,varcha ...