background-size语法:

  /*Mozilla*/ -moz-background-size: auto || <length> || <percentage> || cover || contain

  /*Webkit*/ -webkit-background-size: auto || <length> || <percentage> || cover || contain

  /*Presto*/ -o-background-size: auto || <length> || <percentage> || cover || contain

  /*W3c标准*/ background-size: auto || <length> || <percentage> || cover || contain

  参数:

  auto:默认值,就是使用背景图保持原样,不做任何参数修改,这个效果就相当于没加background-size效果一样

  length:指定两个值,单位px,分别制定背景图的宽度和高度

  percentage:指定两个百分数,但同length指定宽高不同的是,percentage指定的百分比是根据被设置背景图片的容器的大小为基准的

  cover:background-size取值为cover时,背景图片自己会放大到适合容器的尺寸

  contain:cover是把背景图片放大到适合元素容器的尺寸,这时的contain刚好是跟cover相反,是把背景图片缩小到适合元素容器的尺寸

css3整理--background-size的更多相关文章

  1. CSS3中background属性的调整

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

  2. css3 背景background

    Css3背景<background> Css3包含多个新的背景属性,它们提供了对背景更强大的控制.可以自定义背景图的大小,可以规定背景图片的定位区域,css3还允许我们为元素使用多个背景图 ...

  3. css2和CSS3的background属性简写

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

  4. css3整理-方便查询使用

    最近详细地研究了CSS3的相关内容,并整理了这个文档,方便以后查询使用,分享给大家. 案例代码大家可以下载参考下:https://gitee.com/LIULIULIU8/CSS3 1.边框属性bor ...

  5. css3之background

    background background: (1)url(image1.png) right bottom, (2)url(image2.png) center, (3)url(image3.png ...

  6. css3的Background新属性

    前言 CSS3中出现了几种关于背景图片的新属性:background-origin.background-clip.background-position等.之前大致了解了下,但是background ...

  7. CSS背景和CSS3背景background属性

    css背景属性用于定义HTML元素的背景 背景属性既可以为单个的单元设置背景,也可以为整个页面设置背景,可以对上述二者的任意组合设置背景,段落.文字.不同状态的链接.图像.内容区域修改其背景样式.设置 ...

  8. css3整理--::selection

    ::selection作用: 当使用鼠标选择文本时,改版被选中文本的背景色和前景色.(默认情况下,window中背景色是深蓝色,前景色是白色.) ::selection语法: /*Mozilla Fi ...

  9. css3整理--background-image

    background-image语法: background-image: url1,url2,...,urlN; 通过“,”分隔N张背景图片,background的所有其它属性需要配合该属性进行设置 ...

  10. css3整理--gradient

    gradient语法: -moz-linear-gradient( [<point> || <angle>,]? <stop>, <stop> [, & ...

随机推荐

  1. Log4j2 + Maven的配置文件示例详解

    一.配置Maven:pom.xml <properties> <project.build.sourceEncoding>UTF-8</project.build.sou ...

  2. C# SpinWait 实现

    其实SpinWait的code 非常简单,以前看过很多遍,但是从来都没有整理过,整理也是再次学习吧. 我们先看看SpinWait的一些评论或者注意点吧:如果等待某个条件满足需要的时间很短,而且不希望发 ...

  3. Java线程池 / Executor / Callable / Future

    为什么需要线程池?   每次都要new一个thread,开销大,性能差:不能统一管理:功能少(没有定时执行.中断等).   使用线程池的好处是,可重用,可管理.   Executor     4种线程 ...

  4. JFinal提示:java.lang.RuntimeException: dao 只允许调用查询方法

    public class UserModel extends Model<UserModel>{ public static final UserModel userDao = new U ...

  5. HTML解析库Gumbo简单使用记录

    目录 Gumbo简介 使用记录 1.GumboNode的类型 2.简单的使用 Gumbo简介 Gumbo是谷歌开源的一个纯C编写的HTML解析库,性能很好,就是用起来比较麻烦. github地址htt ...

  6. SQL Server死锁产生原因及解决办法 .

    其实所有的死锁最深层的原因就是一个:资源竞争 表现一: 一个用户A 访问表A(锁住了表A),然后又访问表B,另一个用户B 访问表B(锁住了表B),然后企图访问表A,这时用户A由于用户B已经锁住表B,它 ...

  7. Background Media Recovery terminated with ORA-1274 after adding a Datafile (Doc ID 739618.1)

    APPLIES TO: Oracle Database - Enterprise Edition - Version 9.2.0.1 to 12.1.0.2 [Release 9.2 to 12.1] ...

  8. alter日志报WARNING: too many parse errors

    数据库版本:12.2.0 操作系统版本:RHEL7.2 最近观察到一个数据库alert日志老是报硬解析太多错误,且对应的sql语句都是查看数据字典表: 2017-06-16T08:46:46.4174 ...

  9. 设置Nginx以列表方式显示网站内容

    服务器目录内容: 访问该页面时,将所有文件和目录按列表方式显示 nginx配置文件

  10. Spring Boot 2.0 利用 Spring Security 实现简单的OAuth2.0认证方式2

    0.前言 经过前面一小节已经基本配置好了基于SpringBoot+SpringSecurity+OAuth2.0的环境.这一小节主要对一些写固定InMemory的User和Client进行扩展.实现动 ...