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. Win8电脑蓝屏并提示dpc_watchdog_violation

    用尽系统自带的工具均无法恢复,F8能进系统.后来使用如下方法解决了 这种错误情况的发生可能是由于 iastor.sys 驱动没有完全兼容 Windows 8系统所造成的. 微软正在研究一种可行方案,来 ...

  2. (转)对比MS Test与NUnit Test框架

    前言: 项目中进行Unit Test时,肯定会用到框架,因为这样能够更快捷.方便的进行测试. .Net环境下的测试框架非常多,在这里只是对MS Test和NUnit Test进行一下比较, 因为这两个 ...

  3. 比较常用到的一些linux命令行

    find ./ -type f -name "*.c" | xargs grep -l "tm_common_ctrl_init_chip_init"     ...

  4. noi 04:求整数的和与均值

    04:求整数的和与均值 查看 提交 统计 提问 总时间限制:  1000ms 内存限制:  65536kB 描述 读入n(1 <= n <= 10000)个整数,求它们的和与均值. 输入 ...

  5. 关于baseflight cleanflight naze32不能解锁的办法

    需要修改源代码,重新编译.. mcfg.mincheck = 1150; mcfg.maxcheck = 1850; 当然,这是笨方法.还有个办法设置解锁检查的最大最小油门 在控制台,也就是 CLI那 ...

  6. 国内固定电话正则验证:'tel': [/0\d{2,3}-\d{7,8}(|([-\u8f6c]{1}\d{1,5}))$/, "请填写有效的电话号码"],

    // 验证字段 $('#info_form').validator({ rules : { checkMobile : function(ele) { return checkMobile(ele); ...

  7. js字符串和正则表达式中的match、replace、exec等函数详解

    正则并不是经常使用,而正则和字符串之间的函数关系又错综复杂,谁是谁的函数,又是怎么样的一种结果,往往我们是看一遍忘一遍,对此我是头疼不已,感觉自己是个笨蛋^_^. 为了以后不再查文档,特此把常用的函数 ...

  8. Qt中使用Windows API

    在Windows平台上进行开发,不可避免与Windows API打交道,Qt中使用的时候要添加对应API的头文件和链接lib文件,另外使用的Windows API的代码部分要使用#ifdef  Q_O ...

  9. jquery 通过ajax FormData 对象上传附件

    之前上传附件都是用插件,或者用form表单体检(这个是很久以前的方式了),今天突发奇想,自己来实现附件上传,具体实现如下 html: <div>   流程图: <input id=& ...

  10. table 边框显示

    .td{border:solid #add9c0; border-width:0px 1px 1px 0px;}.table{border:solid #add9c0; border-width:1p ...