background:url(./images.png) no-repeat 0 center;  //图像地址 不重复 水平位置0 垂直位置居中
background:url(./images.png) no-repeat -10px -5px;

background:url(./images.png) no-repeat 0 center;
的意思是 图像地址 不重复 水平位置0 垂直位置居中

0 center 的意思就是 水平位置0 垂直位置居中
-10px -2px 的意思就是 水平位置-10px 垂直位置-2px

这两个值和background-position 属性是一样的,即设置背景图像的起始位置。
这个属性设置背景原图像的位置,背景图像如果要重复,将从这一点开始。
默认值:0% 0%
可能的值
top left
top center
top right
center left
center center
center right
bottom left
bottom center
bottom right (以上,如果您仅规定了一个关键词,那么第二个值将是"center"。)

x% y% ( 第一个值是水平位置,第二个值是垂直位置。左上角是 0% 0%。右下角是 100% 100%。如果您仅规定了一个值,另一个值将是 50%。)

mpx npx (第一个值是水平位置,第二个值是垂直位置。左上角是 0 0。单位是像素 (0px 0px) 或任何其他的 CSS 单位。如果您仅规定了一个值,另一个值将是50%。)

您可以混合使用 % 和 position 值。

作者:tianlinzhao
链接:https://www.jianshu.com/p/a32ce8714b1d
来源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

background:url(./images.png) no-repeat 0 center的用法的更多相关文章

  1. 对background: url("~assets/img/common/collect.svg") 0 0/14px 14px 的理解

    需求:给收藏数字前面通过::before伪元素添加图标 相关代码: .goods-info .collect { position: relative; } .goods-info .collect: ...

  2. background:url() 背景图不显示

    奇怪的问题: .box-3 { width: 100%; height: 500px; border: solid 2px red; margin-top: 70px; padding: 0 0 0 ...

  3. background: url 背景图片加时间戳不显示图片

    在项目中一段这样的代码 背景图片加时间戳图片显示不出来 <div id="header" class="header clearfix" style=&q ...

  4. CSS中background:url(图片) 不能显示的问题

    刚刚碰到一个奇怪的问题,这样一段CSS代码:   .pho6 { background: url(img/pho6.jpg);  } 这段代码居然不能显示出背景图片,路经绝对是没错的代码肯定没有问题, ...

  5. css background url 路径

    刚刚碰到一个奇怪的问题,这样一段CSS代码: 1 .pho6 { background: url(img/pho6.jpg);  } 这段代码居然不能显示出背景图片,路经绝对是没错的代码肯定没有问题, ...

  6. Django中CSS加载background url('')问题

    Django中CSS加载background url('')问题   在django中, 默认CSS中如果有 background url('images/a.jpg') 这类的属性,会被django ...

  7. MVC action 执行两次 background url()

    大年初七第一天上班就来解决问题,我也是醉了. 其实是历史遗留问题,今天看到后不能忍了,赶紧解决一下. 旧系统中以一个微信版本的列表页面没有问题,在新系统中重新开发一边后发现列表页面的action总是请 ...

  8. orcal数据库得连接必须用localhost,url中不要用127.0.0.1,不然无法连接

    orcal数据库得连接必须用localhost,url中不要用127.0.0.1,不然无法连接,

  9. 黑猫关键词URL采集工具 Pro v1.0

    功能介绍:黑猫关键词URL采集工具 Pro v1.0 批量关键词自动搜索采集 自动去除垃圾二级泛解析域名 可设置是否保存域名或者url 联系客服QQ:944520563

随机推荐

  1. Directx11教程(57) 环境映射

    原文:Directx11教程(57) 环境映射       建好skydome后,如果我们想让其中的某个物体,比如那个球体来映射出周围环境的蓝天白云(不包括自己附近的物体),该怎么做呢?此时可以把这个 ...

  2. day39-Spring 05-Spring的AOP:不带有切点的切面

    Spring底层的代理的实现: 不带切点的切面是对类里面的所有的方法都进行拦截. 做Spring AOP的开发需要两个包:一个是AOP的包,一个是AOP联盟的包(因为规范是由AOP联盟提出来的). 用 ...

  3. js图片裁切

    js的图片裁切只支持移动和右下拉 html部分 <div id="box" class="box"> <img class="img ...

  4. 写一个nginx监控日志

    下面的代码是实现一个nginx监控日志功能,是不是很好玩呢.

  5. TIJ——Chapter Thirteen:Strings

    String 对象是不可修改的,对于被String 重载的'+' 和'+=' 运算符来说,当你用它们来连接两个String 对象的时候,它在底层并不会对于每一次连接均生成一个String 对象,取而代 ...

  6. Maven中央存储库 和 如何从Maven远程存储库下载?

    当你建立一个 Maven 的项目,Maven 会检查你的 pom.xml 文件,以确定哪些依赖下载.首先,Maven 将从本地资源库获得 Maven 的本地资源库依赖资源,如果没有找到,然后把它会从默 ...

  7. Python深入:setuptools简介

    Setuptools是Python Distutils的加强版,使开发者构建和发布Python包更加容易,特别是当包依赖于其他包时.用setuptools构建和发布的包与用Distutils发布的包是 ...

  8. UITableView 刷新问题

    遇到的问题: 在程序里异步请求服务器后回调函数中处理数据和界面数据的刷新,但是更新UITableView的时候总是很慢才更新完,打印TableView的代理方法也都很快打印. 解决办法就是: [sel ...

  9. mysql basic operation,mysql总结,对mysql经常使用语句的详细总结,MySQL学习笔记

    mysql> select * from wifi_data where dev_id like "0023-AABBCCCCBBAA" ; 1.显示数据库列表.show d ...

  10. vue-awesome-swiper轮播插件的使用方法及问题。

    在使用vue-awesome-swiper的时候,遇到一些问题,记录一下!       1.npm 安装 npm install vue-awesome-swiper --save 2.使用 在mai ...