CSS3中提出了background-size属性，该属性可以设置背景图片的大小，该属性的值设置为绝对数值或者百分比时对background-position没有任何影响，当设置为contain/cover时就会产生影响，其中有一个值会无效。

background-size:contain 该属性会让背景图片宽度或高度适应父元素，如果要缩放的话是等比例缩放，背景图片绝对不会超出父元素

background-size:cover 该属性会让背景图片填满父元素，如果要缩放的话是等比例缩放，背景图片可能会超出父元素

当图片的宽度大于高度时，position的top值无效

当图片的宽度小于高度时，position的left值无效

background-size对background-position的影响的更多相关文章

  1. Batch Size对神经网络训练的影响

    ​ 前言 这篇文章非常全面细致地介绍了Batch Size的相关问题.结合一些理论知识,通过大量实验,文章探讨了Batch Size的大小对模型性能的影响.如何影响以及如何缩小影响等有关内容. 本文来 ...

  2. ListView addHeaderView 对 position 的影响

    1. 在 public View getView(int position, View convertView, ViewGroup parent) 中position 和 是否有headerView ...

  3. position布局影响点击事件以及冒泡获取事件目标

    在编写功能时总是会出现很多意想不到的问题,现在就讲讲我遇到的两个问题,通过举一个相似的例子来解说. <1> 元素互相独立,不存在包含于被包含 选择城市的按钮,为它绑定点击事件,点击后就弹出 ...

  4. 用Qt写软件系列五：一个安全防护软件的制作（2）

    引言 在上一篇中讲述了主窗体的创建和设计.主窗体的无边框效果.阴影效果.拖动事件处理.窗体美化等工作在前面的博客中早就涉及,因此上篇博文中并未花费过多笔墨.这一篇继续讲述工具箱(Tool Button ...

  5. background之你不知道的background-position

    这是一个有趣的话题 其实我并不确切的平时大家是怎么去应用或者玩转一个属性,一个值.我能肯定的是这些东西都有不少的可玩性. 我今天要聊的 background-position 应该已经被大家玩得色彩斑 ...

  6. css2和CSS3的background属性简写

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

  7. 20190328-CSS样式一：字体样式font-、文本样式text-、背景图样式background-

    目录 CSS参考手册:http://css.doyoe.com/ 1.字体简写:font:font-style || font-variant || font-weight || font-size ...

  8. html5常用属性text-shadow、vertical-align、background如何使用

    html5常用属性text-shadow.vertical-align.background如何使用 一.总结 一句话总结: 1.text-shadow:[x轴(X Offset) y轴(Y Offs ...

  9. background 设置文本框背景图

    background 属性的作用是给元素设置背景,它是一个复合属性,常用的子属性如下: background-color 指定元素的背景颜色. background-image 指定元素的背景图像. ...

  10. 例子：Background Audio Streamer Sample

    The Background Audio Streamer sample demonstrates how to create an app that uses a MediaStreamSource ...

随机推荐

  1. Python基础s14-day1

    2016年7月23日"Python基础s14-Day1" Python是什么? Python(英国发音:/ˈpaɪθən/ 美国发音:/ˈpaɪθɑːn/),是一种面向对象.直译式 ...

  2. POSIX, Bash, GPL etc

    POSIX , SUS, XSI Portable Operating System Interface POSIX是给Unix/Linux系统使用的通用调用接口(SCI, System Call I ...

  3. python入门综合

    #!/usr/bin/env python#-*-coding:utf-8-*- #以上是配置编写环境的开始   #第一行env表示运行当前环境变量内的python版本(2.x or 3.x)#第二行 ...

  4. ELK Nxlog->Kafka->ElasticSearch

    Windows 系统下,log4日志通过kafka发送到elasticsearch; windows 下nxlog没有找到直接发送数据到kafka的插件,所以采用logstash中转下     Nxl ...

  5. Eclipse 无线调试（利用ADB工具）

    首先:1.你的手机必髯要有ROOT权限才可以安装ADB工具:2.手机开启WLAN(WIFI): (1)安装ADB工具: (2)添加环境变量PATHA;(我的是ADB路径是:D:\adt-bundle- ...

  6. centos6.5编译安装lamp开发环境

    一.系统以及软件的准备 系统及编译安装包的下载地址:http://pan.baidu.com/s/1jIjqinc   密码:ghc2 说明:由于centos6.5是分卷压缩的,且压缩为三个压缩包,所 ...

  7. 使用Fiddler对Android或者iOS设备进行抓包

    1.PC端Fiddler配置 Tools->HTTPS->选中“Decrpt HTTPS traffic”,“Ignore server certificate errors” Tools ...

  8. Azure 删除VHD时报错：There is currently a lease on the blob and no lease ID was specified in the request

    可下载:http://clumsyleaf.com/products/cloudxplorer 然后在Accounts中新建一个Account,账号与Key,可在相应的storage Manage A ...

  9. cloudera cdh native lib

    如果通过命令行的方式安装cloudera 版本的hadoop,下载它的cdh版本. 解压后执行,你会发现报warning,没有native的库,lib/native是空的. 如何获取native的文件 ...

  10. FineReport构建银行金融租赁考核系统

    一.应用背景 我们今天以民生银行为案例来交大家如何利用报表工具搭建金融租赁考核系统.民生银行在IT建设上已经建设邮件系统.外部网站系统.视频会议系统.OA系统.财务系统.自助报销系统.核心系统.资金管 ...