http://www.cnblogs.com/greenteaone/archive/2012/08/28/2659878.html  (原创作者链接地址  )

Background-Size:[ <length> | <percentage> | auto ]{1,2} | cover | contain

background-size指定背景大小,以象素或百分比显示。当指定为百分比时,大小会由所在区域的宽度、高度,以及background-origin的位置决定。还可以通过cover和contain来对图片进行伸缩。

background-size可以设置2个值,1个为必填,1个为可选。第1个值用于指定背景图的width,第2个值用于指定背景图的height。

如果只给background-size设置1个值,则第2个值默认为auto(cover和contain特定值除外)。

 
<length>:设置背景图片的高度和宽度(单位:px)。第一个值设置宽度,第二个值设置的高度。如果只给出一个值,第二个是设置为“auto”,

               例如:background-size: 100px 200px;背景宽100px,高200px;

<percentage>:设置背景图片的高度和宽度(单位:%)。第一个值设置宽度,第二个值设置的高度。如果只给出一个值,第二个是设置为“auto”

               例如:background-size: 100% 100%;背景充满

cover: 缩放图像的最小值,其宽度和高度都能放入内容区域

contain:缩放图像的最大值,其宽度和高度都能放入内容区域

效果如下:

background-sizi (转)的更多相关文章

  1. css样式之background详解

    background用法详解: 1.background-color 属性设置元素的背景颜色 可能的值 color_name            规定颜色值为颜色名称的背景颜色(比如 red) he ...

  2. css样式之background详解(格子效果)

    background用法详解: 1.background-color 属性设置元素的背景颜色 可能的值 color_name            规定颜色值为颜色名称的背景颜色(比如 red) he ...

  3. CSS背景background、background-position使用详解

    背景(background)是css中一个重要的的部分,也是需要知道的css的基础知识之一.这篇文章将会涉及css背景(background)的基本用法,包括诸如 background-attachm ...

  4. CSS 中关于background 属性功能

    background 是 css中的核心属性,我们对他应该充分了解. background-image   定义背景图像  这个属性是我们用的最多的属性 设置背景图像有两个方式 background: ...

  5. 1 background(复合属性)与font(复合属性) 2 行内块的间距问题 3 行内元素的margin 4 清除浮动 5定位的元素的层级 6 Border-radius: 边框半径

    1 background(复合属性)与font(复合属性): background: 颜色  图片的链接  是否平铺  背景位置 是否滚动.(可以随意调动或省略) Font: 粗度 字体风格 字体大小 ...

  6. Android什么时候进行View中Background的加载

    对大多数Android的开发者来说,最经常的操作莫过于对界面进行布局,View中背景图片的加载是最经常做的.但是我们很少关注这个过程,这篇文章主要解析view中背景图片加载的流程.了解view中背景图 ...

  7. CSS中对图片(background)的一些设置心得总结

    写网页的时候很多情况需要对图片进行操作,如何在不进行专业的美工裁切操作的情况下而让自己的素材度达到最大的满意度呢,这是一个问题,对于懒得开ps切图的我,通常会直接在网络上download一张图片,直接 ...

  8. PopupWindow 点击外部和返回键无法消失背后的真相(setBackgroundDrawable(Drawable background))

    刚接手PopupWindow的时候,我们都可能觉得很简单,因为它确实很简单,不过运气不好的可能就会踩到一个坑: 点击PopupWindow最外层布局以及点击返回键PopupWindow不会消失 新手在 ...

  9. CSS背景background详解,background-position详解

    背景(background)是css中一个重要的的部分,也是需要知道的css的基础知识之一.这篇文章将会涉及css背景(background)的基本用法,包括诸如 background-attachm ...

  10. css中background背景属性概

    css中background背景属性概 background:url(背景图片路径)  no-repeat;/*不重复默认在左上方*/background:url(背景图片路径)  no-repeat ...

随机推荐

  1. LINUX 设置ll的时候显示日期的格式

    1.临时更改显示样式,当回话结束后恢复原来的样式 export TIME_STYLE='+%Y-%m-%d %H:%M:%S'    # 直接在命令中执行即可 2.永久改变显示样式,更改后的效果会保存 ...

  2. SecureCRT连接VirtualBox下的ubuntu以及NMP的搭建与通过宿主机访问该NGINX服务器过程

    一直使用wamp作为开发环境,只是工作中时常会遇到在wamp下没问题但是提交到服务器生产环境会出现一些意想不到的情况,由此萌生了在本机搭建LNMP环境的想法,我个人不知道其他人的虚拟机搭建服务器环境是 ...

  3. JsonUtil工具类

    package comm; import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Collec ...

  4. Oracle EBS 初始化用户密码(转)

    ---修改密码,并且将限制用户下次登录的时候(第一次登录),强制要换一个新的口令: ---此过程可以完全模拟我们在标准用户的Form里面初始化用户的密码的动作! ---最后要说明的是,这个处理过程是通 ...

  5. 最新IP地址数据库 二分逼近&二分查找 高效解析800万大数据之区域分布

    最新IP地址数据库  来自 qqzeng.com 利用二分逼近法(bisection method) ,每秒300多万, 比较高效! 原来的顺序查找算法 效率比较低 readonly string i ...

  6. 渗透日记-利用SQLMAP伪静态注入

    今日找到一个网站,做下安全检测,url是这样的: 不是传统的.php结尾,所以很多人认为这个不能注入,其实伪静态也能注入的,这个url虽然做了伪静态,但是还是需要传递参数到数据库去查询的,试试能否注入 ...

  7. 基于eBox旋转编码器

    在电子产品设计中,经常会用到旋转编码开关,比如数码电位器等,它的英文名翻译过来就是Rotary Encoder Switch.常见的有5pin和3pin产品.5pin实在左右旋转的基础上增加了向下按得 ...

  8. hashCode的作用

    在一般的应用中你不需要了解hashCode的用法,但当你用到HashMap,HashSet等集合类时要注意下hashCode.     你想通过一个object的key来拿HashMap的value, ...

  9. python直接执行另一个文件中的代码

    看你弄的这么辛苦,给你的方法exec(open(".py","r").read)open(".py",'r').read() 就是读取文件的 ...

  10. 接口测试第十二课(fidller过滤)(转)

    转自: 经常有人问我,如何只抓手机上某个应用的请求包?在使用fiddler抓手机包的过程中,fiddler会话框上瞬间就满屏了,因为它不仅抓到手机上的请求数据包,也抓到了PC端的网络请求包.这时候很难 ...