先来看下语法:

background-size: length|percentage|cover|contain;

具体的值,百分比都ok,w3c上面说的很清楚,当时具体的值或者百分比的时候,第一个表示宽,第二个表示高,高度不设置的话会设为auto,

缺点:
图片会变形
cover:背景图像完全覆盖背景区域,会随背景区域的大小等比例缩放
缺点:
背景图像的某些部分也许无法显示在背景定位区域中。
contain:把图像图像扩展至最大尺寸,以使其宽度和高度完全适应内容区域。
缺点:

容器会留白

css background-size的更多相关文章

  1. CSS background 属性详解

    CSS background Property 语法: background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-cl ...

  2. CSS 背景-CSS background

    这里有个很好的样式学习网站:http://www.divcss5.com/rumen/r125.shtml 一.Css background背景语法   -   TOP CSS背景基础知识 CSS 背 ...

  3. CSS background 属性 总结

    CSS background 属性总结

  4. HTML CSS——background的认识(一)

    今天回归bug时无意间看到了样式表中background属性,如今总结一下: 1.background-color:设置元素的背景色.其值能够为:color-name.color-rgb.color- ...

  5. css background之设置图片为背景技巧

    css background之设置图片为背景技巧-css 背景 Background是什么意思,翻译过来有背景意思.同样在css里面作为css属性一成员同样是有背景意思,并且是设置背景图片.背景颜色. ...

  6. CSS background 之设置图片为背景技巧

    首先先来看看background有那些值: 可以按顺序设置如下属性(可点击进入相应的css手册查看使用):background-color 背景颜色background-image 背景图片backg ...

  7. [CSS3] CSS Background Images

    Body with background image and gradient html { background: linear-gradient(#000, white) no-repeat; h ...

  8. css background之设置图片为背景技巧

    原文 Background是什么意思,翻译过来有背景意思.同样在css里面作为css属性一成员同样是有背景意思,并且是设置背景图片.背景颜色.背景图片截取等样式. 首先先来看看background有那 ...

  9. css background transparent All In One

    css background transparent All In One opacity ul { max-height: 100px; /* max-height: 187px; */ overf ...

  10. css & background & svg

    css & background & svg https://developer.mozilla.org/en-US/docs/Web/CSS/background backgroun ...

随机推荐

  1. Eclipse智能提示及快捷键

    1.java智能提示 (1). 打开Eclipse,选择打开" Window - Preferences". (2). 在目录树上选择"Java-Editor-Conte ...

  2. CentOS7.1下JDK+Tomcat应用环境搭建

    最近由于项目的原因,需要测试Linux环境下的应用部署情况.选用了CentOS7.1版本+JDK1.6版本+Tomcat7.0版本进行搭建.其间各种折磨就不说了,随手把相关的注意事项和大概的步骤记录下 ...

  3. Java系列笔记(2) - Java RTTI和反射机制

    目录 前言 传统的RTTI 反射 反射的实现方式 反射的性能 反射与设计模式 前言 并不是所有的Class都能在编译时明确,因此在某些情况下需要在运行时再发现和确定类型信息(比如:基于构建编程,),这 ...

  4. BAE hibernate c3p0数据库连接池

    根据BAE官方文档:bae是不支持连接池的,但今天试验却能实现hibernate c3p0连接池,避免mysql连接超时 hibernate主配置文件hibernate.cfg.xml代码 <! ...

  5. Android Studio打开时提示ADB错误的问题

    如图所示,ADB连接错误,解决办法很简单:打开cmd,定位到sdk文件夹下的platform-tools,然后执行adb kill-server回车:再执行adb start-server即可

  6. tail 显示文件最后若干行内容

    功能:tail命令可以输出文件的尾部内容,默认情况下它显示文件的最后十行.显示每个指定文件的最后10 行到标准输出.若指定了多于一个文件,程序会在每段输出的开始添加相应文件名作为头.如果不指定文件或文 ...

  7. PyAutoGUI-python版的autoit/AHK

    简单介绍各个图形界面自动操作的python库,类似按键精灵\autoit\ahk(autohotkey)等等这些自动化工具.这类python库不是只是用来实现自动游戏之类的程序,业界也用这些库来做GU ...

  8. jQuery lazyload 懒加载

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  9. 2014年5月份第4周51Aspx源码发布详情

    最基本wcf服务器与客户端交互源码  2014-5-26 [VS2003]源码描述:本示例讲解的是最基本的wcf语法,示例浏览请先运行服务端,然后在运行客户端,适合想要学习wcf的初学者.仅供借鉴,欢 ...

  10. Spark源码学习1.2——TaskSchedulerImpl.scala

    许久没有写博客了,没有太多时间,最近陆续将Spark源码的一些阅读笔记传上,接下来要修改Spark源码了. 这个类继承于TaskScheduler类,重载了TaskScheduler中的大部分方法,是 ...