background-size:属性有 auto;length ;百分比

length 如:10px 20px 固定的

或者是写成一个 ,10px  另外一个就默认为 auto;

写成百分比的形式 是相对于div的宽度或者是高度的 包含padding 但是不包含 border的

background-size:cover  意思是背景图片全部填满整个div,往往需要配合background-position:center;来使用,是图片的中间和div的中间在一个中心点。唯一的

缺点就是需要制作一个足够大的背景图片,否则图片会失真。

background-size:contain 可以是背景图像保持本身的宽高比例,将背景图片缩放到宽度或者高度正好适应定义的背景区域。

总之,只有当background-size:值默认为auto的时候,背景图片才不会失真,而其他设置都会导致背景图片的失真,所以使用

的时候要仔细考虑,避免带来不良的后果。

具体的可以自己写一个demo来验证一下。就写到这里。

background-size属性的更多相关文章

  1. css中background背景属性概

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

  2. background复合属性详解(上):background-image

    background复合属性是个很复杂的属性,花样非常多,比较神奇的是css3 中支持多图片背景了,这篇文章先讲讲background-image属性,其他背景属性会在后续的文章综合总结. 一.最基本 ...

  3. 项目总结——SqlParameter的参数设置长度(size属性)

    看到很多朋友在实例化SqlParameter时,通常都没有指定参数的长度就直接给参数赋值了.就像下面的写法: new SqlParameter("@address", SqlDbT ...

  4. background系列属性

    1.background-color背景颜色属性 ①颜色表示方法 英语单词:red   blue   purple    skyblue. rgb:r代表红色   g代表绿色   b代表蓝色    也 ...

  5. 今天碰到一个问题,怎么限制用户在固定宽度的input输入框里输入的长度,由此涉猎到了maxlength属性和size属性以及它们的区别。

    最开始想首先要强制在一行,另外超出的隐藏.还有一个思路是把value的值的长度和框的长度怎么联系起来,具体怎么联系我也不知道. 在解决另外一个问题的时候,哥发给我的代码里无意中看见input有个max ...

  6. size属性

    size 属性 size 属性规定输入字段的尺寸(以字符计): <form action=""> First name:<br> <input typ ...

  7. 前端CSS-font属性,超链接的美化,css精灵,background综合属性

    前端CSS-font属性,超链接的美化,css精灵,background综合属性 1. font属性 使用font属性,能够将字号.行高.字体,能够一起设置. font:14px/24px " ...

  8. C# 调用存储过程出错:String[3]: Size 属性具有无效大小值 0

    存储过程如下 Create PROCEDURE [dbo].[Test] @FundId int, @vchStrategyToken nvarchar(), @ErrorMessage nvarch ...

  9. CSS探案之 background背景属性剖析

    首先,我们先来看看两个css属性:background和background-color,对!就是这两位,相信大家在平时应该没少 麻烦人家把,反正我是这样,几乎也少会用到背景图,原因很简单:就是有点害 ...

  10. [转]实例化SqlParameter时,如果是字符型,一定要指定size属性

    转自:http://bbs.csdn.net/topics/380155255 以前在实例化SqlParameter时,通常都是用下面的语句,没有设置size属性: new SqlParameter( ...

随机推荐

  1. navicat-premium11.1.6 x64关键

    Navicat Premium version patch   11.2.16.0 >navicat.exe0000000001CECCBC:80->C60000000001CECCBD: ...

  2. ribbon负载均衡进行服务消费

    相同服务以不同端口形式注册到eureka上,ribbon从eureka上获取冰进行服务消费,会偶现如下现象: I/O error on GET request for "http://COM ...

  3. 一个简单的EBNF范式的实现

    最近无事在看书的时候发现了这个东西刹那间突然觉得大学时候编译原理书上的的什么语法分析书.上下文无关等晦涩难懂的概念清晰了许多今天把它贴出来希望也能让你回想起些往事... 至于EBNF范式是什么东西,网 ...

  4. 关于Cascading

    Cascading是一个开源的Java库和应用程序编程接口(API),它为MapReduce提供了一个抽象层.它允许开发者构建出能在Hadoop集群上运行的复杂的.关键任务的数据处理应用. Casca ...

  5. 0mq

  6. Java中数组复制的几种方式以及数组合并

    1.Object.clone() 简单直接,只能对源数组完整地复制 2.Arrays.copyOf(T[] original, int newLength) 可以只复制源数组中部分元素,但复制的起始位 ...

  7. android user 版本如何默认adb调试为打开【转】

    本文转载自:http://blog.csdn.net/chaihuasong/article/details/50342119 A. 软件准备 user版本需要先打开USB debug开关,打开方式如 ...

  8. SDUT OJ 1221 亲和数 (找出某个数n所有的因子数,只需要暴力:2->sqrt(n) 即可 )

    亲和数 Time Limit: 1000ms   Memory limit: 65536K  有疑问?点这里^_^ 题目描述 如果a的因子和等于b,b的因子和等于a,且a≠b,则称a,b为亲和数对. ...

  9. springboot在idea实现热部署

    1.在pom.xml引入热部署devtools依赖 <dependency> <groupId>org.springframework.boot</groupId> ...

  10. WAS:服务器停电后,重启DMGR,控制台访问不了

    1.   今天有现场WAS服务器停电,重启DMGR后,控制台网页打不开: 后来得知,防火墙可能有问题.(虽然之前该机器上防火墙是关着的,但掉电后,防火墙会重启规则) 关掉防火墙后,问题解决. 2.   ...