background-size: left center | 0% 50% | cover | contain

backgound-size: left center | 0% 50%; 这个指的是背景水平、垂直的大小控制

background-size: cover; 背景铺满整个容器,如果背景是图片,按照图片大小比例铺满整个容器

background-size: contain;  容器包含背景,它和上面不一样的地方是它是包含关系,有个padding值

IE下如何使用?

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale');
  • 需要注意的一点是:不要把IE滤镜应用到html和body上,会导致滚动条和链接出问题
  • 使用IE滤镜不会保持背景图片的宽高比,也即图片可能会变形

本文内容部分采自:www.topcss.org

background-size使用的更多相关文章

  1. CSS3详解:background

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

  2. CSS3中background属性的调整

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

  3. 解决C# WinForm Graphics绘制闪烁问题

    不直接使用form的CreateGraphics创建Graphics进行绘制,可以先在Form上面放一个需要大小的PictureBox,再创建一个同大小的Bitmap,将这个Bitmap设置为Pict ...

  4. 前端小知识~~关于css3新增知识~~归纳总结

    1.新增选择器 E:nth-last-child(n) E:nth-of-type(n) E:nth-last-of-type(n) E:last-child E:first-of-type E:on ...

  5. 实用的CSS3属性和使用技巧

    CSS可以改进网站的设计并且开拓网站设计更多的可能性,可以令你的网页更具吸引力.对于前端开发者.网站设计师来说,掌握并熟练应用CSS是一项必不可少的技能. 下面列出了一些非常实用的CSS3属性和使用技 ...

  6. Android measure过程分析

    作为一名Android开发人员,我们都知道一个View从无到有,会经历3个阶段: 1. measure/测量阶段,也就是确定某个view大小的过程: 2. layout/布局阶段,也就是确定其左上右下 ...

  7. Android应用层View绘制流程与源码分析

    1  背景 还记得前面<Android应用setContentView与LayoutInflater加载解析机制源码分析>这篇文章吗?我们有分析到Activity中界面加载显示的基本流程原 ...

  8. 自定义控件(View的绘制流程源码解析)

    参考声明:这里的一些流程图援引自http://a.codekk.com/detail/Android/lightSky/%E5%85%AC%E5%85%B1%E6%8A%80%E6%9C%AF%E7% ...

  9. Android开发中的全屏背景显示方案

    引子 不管是Android还是iOS平台中,都可以看到一些应用在启动的时候会先出现一个启动画面(Splash Activity),如QQ.微信等.这个启动画面中往往会将ActionBar和Status ...

  10. 用Qt写软件系列五:一个安全防护软件的制作(2)

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

随机推荐

  1. Linux下命令行显示当前全路径方法

    /etc/profile 和 ~/.bashrc 或者直接在用户的.bash_profile中添加 export PS1='[\u@\h \W]\$' 然后执行source命令

  2. Asp.Net实现Http长连接推送

    话说最新帮一个朋友搞智能家居方面的东西,做一个云平台.主要作用手机在局域网外环境时对手机客户端和智能网关中命令的互相转发. 目前已经有了一个稳定的Socket版本,但是考虑到以后的扩展和性能指标要改成 ...

  3. 总结PHP中几种常用的网页跳转代码

    网页跳转的意思就是指当你在浏览器中访问A页面时,会自动跳转到B页面,往往网页跳转用在404页面中会比较多点.至于怎么实现网页跳转,网上已经提供了很多的方法,有些方法是不可行的,经过测试,叶德华今天就在 ...

  4. [stack]Evaluate Reverse Polish Notation

    Total Accepted: 55722 Total Submissions: 249668 Difficulty: Medium Evaluate the value of an arithmet ...

  5. 使用HAProxy、PHP、Redis和MySQL支撑每周10亿请求

    在公司的发展中,保证服务器的可扩展性对于扩大企业的市场需要具有重要作用,因此,这对架构师提出了一定的要求.Octivi联合创始人兼软件架构师Antoni Orfin将向你介绍一个非常简单的架构,使用H ...

  6. laravel中间件源码分析

    laravel中间件源码分析 在laravel5.2中,HTTP 中间件为过滤访问你的应用的 HTTP 请求提供了一个方便的机制.在处理逻辑之前,会通过中间件,且只有通过了中间件才会继续执行逻辑代码. ...

  7. skynet的流程2

    http://blog.csdn.net/xiarendeniao/article/details/38613161 http://www.jiandan.ren/2015/06/skynet-hel ...

  8. Eclipse配色插件

    1.打开Help -- Eclipse Marketplace 2.搜索Eclipse Color Theme,点击Install 3.安装完成后点击Window -- Preference -- A ...

  9. IC卡

    本词条由“科普中国”百科科学词条编写与应用工作项目 审核 . IC卡 (Integrated Circuit Card,集成电路卡),也称智能卡(Smart card).智慧卡(Intelligent ...

  10. 安卓linearlayout布局的一个嵌套实例

    XML代码如下 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:andr ...