background-size使用

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

时间： 2024-10-11 06:03:46

background-size使用的相关文章

css中 background设置

css2中有五个与背景相关的属性.它们是: background-color:完全填充背景的颜色 background-image:用作背景的图片 background-position:确定背景图片的位置 background-repeat:确定背景图片是否重复铺平 background-attachment:确定背景图片是否随页面滚动

CSS3对于background做了一些修改,最明显的一个就是采用设置多背景,不但添加了4个新属性,并且还对目前的属性进行了调整增强. 1.多个背景图片在css3里面,你可以再一个标签元素里应用多个背景图片.代码类似与css2.0版本的写法,但引用图片之间需用“,”逗号隔开.第一个图片是定位在元素最上面的背景,后面的背景图片依次在它下面显示,如下: background-image: url(top-image.jpg), url(middle-image.jpg), url(bottom-i

CSS3 的一些新特性以及效果

深入了解 CSS3 新特性来源: ibmdeveloperworks 发布时间: 2012-02-06 15:34 阅读: 5114 次推荐: 3 原文链接 [收藏] 摘要:现如今,随着 Web2.0 技术的流行,之前的 CSS2 标准和相关技术似乎已经满足不了日益增长的开发需求:人们需要实现更加美观.用户体验更好的界面.CSS3,这个新一代的标准应运而生.为了满足现有的对于 Web UI 的开发需求,它提供了一系列强大的功能,如许多新的 CSS 属性(文字,布局,颜色等等),

Microsoft Corporation 去掉 windows 修改启动加载版权

windows 修改开机界面 boot启动界面 windows 修改启动加载版权 windows 系统如何修改开机画面的版权文字"Microsoft Corporation ... ◎Microsoft Corporation Microsoft Corporation 去掉作者:韩梦飞沙 Author:han_meng_fei_sha 邮箱:[email protected] E-mail: 313134555 @qq.com 通过16进制的编辑器(我用的是winhex)打开winlo

CSS3的新增属性及其用法

CSS3的新增属性及其用法现如今,随着 Web2.0 技术的流行,之前的 CSS2 标准和相关技术似乎已经满足不了日益增长的开发需求:人们需要实现更加美观.用户体验更好的界面.CSS3,这个新一代的标准应运而生.为了满足现有的对于 Web UI 的开发需求,它提供了一系列强大的功能,如许多新的 CSS 属性(文字,布局,颜色等等),各种 CSS 特效,甚至还支持 CSS 动画.元素的变换.这些 CSS 新特性在现阶段可以说都是非常强大和完善的,您只需要加入几行简单的 CSS 代码便可以实现出一

Android视图View绘制流程与源码分析（全）

来源:[工匠若水 http://blog.csdn.net/yanbober] 1 背景还记得前面<Android应用setContentView与LayoutInflater加载解析机制源码分析>这篇文章吗?我们有分析到Activity中界面加载显示的基本流程原理,记不记得最终分析结果就是下面的关系: 看见没有,如上图中id为content的内容就是整个View树的结构,所以对每个具体View对象的操作,其实就是个递归的实现. 前面<Android触摸屏事件派发机制详解与源码分析一(

深入理解Android View(转)

做android其实也有一段时间了,我们每个人都会碰到一些这样或那样的问题,碰到问题了就拼命百度,可是发现,我们解决问题的能力并没有提升很多,所以我才有想总结一下我项目中所用过的相关知识,并了解一下Android源代码中是如何定义这些属性的,如何去实现的.以后再碰到类似的问题,我该如何实现.本人也不常写博客,希望各位博友能指点,分享,并提出博客中不正确的地方,共勉! 首先我发一份我做的关于Android View深入实现的的XMind的思维导图,可以帮助我一起整理思路,若是博友有什么想到的

Android开发之View重写相关API-onLayout,onMeasure,MeasureSpec

1.onLayout android.view.ViewGroup protected void onLayout(boolean changed, int l, int t, int r, int b) 执行layout操作时调用onLayout方法.View要给它的每个Child设定size和position.拥有Children的子类需要重写onLayout方法并且调用每个Child的layout方法. 参数changed表示view的size或position发生变化.参数l, t,

前端小知识关于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:only-child E:only-of-type E:empty E:checked E:enabled E:disabled E::selection E:not(s) 2.Font-face 特性 Font-face 可以用来加载字体样式,而且它还能够加载服务器端的字体文件,让客户端显示客户端所没

CSS3 - 初识CSS3

.navdemo{ width:560px; height: 50px; font:bold 0/50px Arial; text-align:center; margin:40px auto 0; background: #f65f57; /*制作圆*/ border-radius:5px; /*制作导航立体风格*/ box-shadow:0 5px 5px 0px gray; } .navdemo a{ display: inline-block; -webkit-transition: a