对于这两个属性,官网是这样解释的: contain 此时会保持图像的纵横比并将图像缩放成将适合背景定位区域的最大大小. 等比例缩放图象到垂直或者水平其中一项填满区域. cover 此时会保持图像的纵横比并将图像缩放成将完全覆盖背景定位区域的最小大小. 等比例缩放图象到垂直和水平两项均填满区域. 读了还是不懂,那么看下面的例子: contain,按比例调整背景图片,使得其图片宽高比自适应整个元素的背景区域的宽高比,因此假如指定的图片尺寸过大,而背景区域的整体宽高不能恰好包含背景图片的话,那么其背景…
吐槽啦:Yeah  明天就是国庆了o(* ̄▽ ̄*)o!哈哈,提前祝福各位园友国庆快乐.假期愉快.生活美满.天天开心!国庆我要回家一趟,把一些不用的东西带回家,走访一下亲朋好友,在家打几天酱油~~~ 言归正传,我们回到我们的主题来看看CSS之全屏背景图.Nowdays,满屏大图的网页成为了一种fashion,网页的模板.布局是用CSS.HTML……来设计的,这里就以CSS来聊全屏背景图. 简单点,对于全屏背景图,我们只需用CSS的一个background-size属性就可以了. 当backgrou…
文件夹: 1.CSS凝视的书写 怎么写?优点? 2.CSS引入方式  各种的优缺点 3.选择器的写法与选择器的优先级 4.CSS命名规范 5.背景,行高 6.文本(text与font开头)等全部属性 ① CSS凝视书写规范: 1.单行凝视:        直接写在属性值的后面.如: ① .search{ border:1pxsolid#fff;/*定义搜索输入框边框*/ background:url(../images/icon.gif)no-report#333;/*定义搜索框的背景*/ }…
代码: body { /* 加载背景图 */ background: url(resource/inv_bg.png); /* 背景图不平铺 */background-repeat: no-repeat; /* 背景图垂直.水平均居中 */ background-position: center center; /*这个应该是为了IE浏览器,没深究*/filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=…
background属性: Background属性是css中应用比较多,且比较重要的一个属性,它是负责给盒子设置背景图上和背景颜色的,background是一个复合属性,它可以分解成如下几个设置项: (1)background-color 设置背景颜色 (2)background-image 设置背景图片地址 (3)background-repeat 设置背景图片如何重复平铺 (4)background-position 设置背景图片的位置 (5)background-attachment 设…
CSS背景属性 background css 说明 background-image:url(图片的网址); 背景图 background: url( 图片的网址 ); 背景 background-color:#色码; 背景色彩 Exp: background-image:url(背景图案.jpg,gif,bmp); background-color:#FFFFFF; background-color : tra   CSS背景属性 background css 说明 background-im…
css中允许应用纯色作为背景,也允许使用图片作为背景. background一共有8个对应的属性: 1.background-color:颜色值 用于设定背景的颜色 有3种定义颜色的形式, 1, 颜色关键字表示法,可直接用英文单词来定义,比如red,blue,green等. 2, 16进制表示法,用#000000到#ffffff区间内的16进制数来表示. 3, 三原色表示法,rgb(r,g,b),其中r,g,b分别代表红色,绿色,蓝色,取值范围为0到255. 默认值:transparent 注意…
最近在重温CSS,发现好多东西都忘了,比如background-size属性中,contain与cover的区别. 菜鸟教程上是这么说的: 有点难理解,通俗解释就是:两者均以保持图像宽高比的形式缩放来适合背景容器的大小. 那么两者的区别呢?这就要根据图像是否重复来分别讨论了. 在no-repeat情况下,如果容器宽高比与图片宽高比不同, cover:图片宽高比不变.铺满整个容器的宽高,而图片多出的部分则会被截掉: contain:图片自身的宽高比不变,缩放至图片自身能完全显示出来,所以容器会有留…
写主题样式的时候经常会碰到用背景图铺满整个背景的需求,这里分享下使用方法 需要的效果 图片以背景的形式铺满整个屏幕,不留空白区域 保持图像的纵横比(图片不变形) 图片居中 不出现滚动条 多浏览器支持 以图片bg.jpg为例 方法一.最简单,最高效的方法 CSS3.0 归功于css3.0新增的一个属性background-size,可以简单的实现这个效果,这里用fixed和center定位背景图,然后用background-size来使图片铺满,具体css如下 html { background:…
CSS中  background 是一个很基本的而且比较常用的样式 background : background-color || background-image || background-repeat || background-attachment || background-size || background-clip || background-position 这个是 background 的几个参数,这些参数并不是都要写上的. 1.background-color: 背景颜色…