html, body
{
/*此部分支持chrome,应该也支持firefox*/
background: rgb(246,248,249);
background: url('/styles/images/bg.jpg') no-repeat center fixed;
background-attachment: fixed;
background-size: 100% 100%;
/*以下是IE部分,使用滤镜*/
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/styles/images/bg.jpg',sizingMethod='scale');
background-repeat: no-repeat;
background-positon: 100%, 100%;
font: normal 12px tahoma, arial, verdana, sans-serif;
margin: 0;
padding: 0;
border: 0 none;
overflow: hidden;
height: 100%;
}

说明:

在对象容器边界内,在对象的背景和内容之间显示一张图片。并提供对此图片的剪切和改变尺寸的操作。如果载入的是PNG(Portable Network Graphics)格式,则0%-100%的透明度也被提供。

语法:

filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=\'#\'" )

enabled: 可选项。布尔值(Boolean)。设置或检索滤镜是否激活。
true:默认值。滤镜激活。 
false:滤镜被禁止。

sizingMethod: 可选项。字符串(String)。设置或检索滤镜作用的对象的图片在对象容器边界内的显示方式。
crop:剪切图片以适应对象尺寸。 
image:默认值。增大或减小对象的尺寸边界以适应图片的尺寸。 
scale:缩放图片以适应对象的尺寸边界。

src: 必选项。字符串(String)。使用绝对或相对 url 地址指定背景图像。假如忽略此参数,滤镜将不会作用。

实现body背景拉伸自适应 兼容chrome ie7,8,9.ie6未测试的更多相关文章

  1. 【Python全栈-CSS】CSS实现网页背景图片自适应全屏

    CSS实现网页背景图片自适应全屏 功能:实现能自适应屏幕大小又不会变形的背景大图,而且背景图片不会随着滚动条滚动而滚动. 以下是用CSS实现的方法: <html> <head> ...

  2. 兼容chrome和ie的音乐播放

    兼容chrome和ie的音乐播放(Ie7 Ie8 Ie9 均測试过 ) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona ...

  3. textarea增加字数监听且高度自适应(兼容IE8)

    1.封装方法: var textareaListener = { /*事件监听器兼容 * *attachEvent——兼容:IE7.IE8:不兼容firefox.chrome.IE9.IE10.IE1 ...

  4. 加入收藏夹的js代码(求兼容chrome浏览器的代码)

    从网上找了加入收藏夹的js代码,但不兼容chrome,不知道有没有兼容chrome的相关代码,希望有知道的告诉一下,谢谢! 代码如下 $("#id").click(function ...

  5. 基于html5背景图片自适应代码

    基于html5背景图片自适应代码是一款背景不随滚动条滚动,会根据分辨率不同自动匹配对应的背景图片.效果图如下: 在线预览   源码下载 实现的代码. css代码: .jawbone-hero .jaw ...

  6. JS - 兼容到ie7的自定义样式的滚动条封装

    demo: html: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  7. js+css实现点击回到顶部的效果(最低兼容至ie7)

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  8. bootstrop设置背景图片自适应屏幕

    如果不用bootstrop框架,想让背景图片自适应窗口大小,可以这样做: <style type="text/css"> html{height: %;} body.a ...

  9. CSS背景图拉伸自适应尺寸,全浏览器兼容

    突然有人问我这个问题,说网上CSS filter的方法在非IE浏览器下不奏效.思考之后,问题之外让我感慨万千啊,很多我们所谓的难题,都会随着时代的发展迎刃而解,或被新的问题所取代. 当CSS背景图片拉 ...

随机推荐

  1. ubuntu系统

    Ubuntu 18.04 NVIDIA驱动安装总结:(需要和自己电脑上的显卡配套) https://blog.csdn.net/tjuyanming/article/details/80862290 ...

  2. 另一个SqlParameterCollection中已包含SqlParameter(转)

    一般情况下,我们定义的一个SqlParameter参数数组,如: SqlParameter[] parms =             {                new SqlParamete ...

  3. Resharper 使用帮助-自动生成文件头

    VS2012 安装完resharper 后,在resharper选项中选择 Code Editing – File Header Text . 输入自定义的文件头格式.如果需要在文件头外层添加regi ...

  4. node.js(http协议)

    七层网络协议 应用层:浏览器(http,FTP,DNS,SMTP,TeInet)(邓哥)表示层:加密,格式转换(怕别人偷看,加密摩斯电码)会话层:解除或者建立和其他节点的联系(邓哥在想追这个女孩,不再 ...

  5. 洛谷P4783 【模板】矩阵求逆(高斯消元)

    题意 题目链接 Sol 首先在原矩阵的右侧放一个单位矩阵 对左侧的矩阵高斯消元 右侧的矩阵即为逆矩阵 // luogu-judger-enable-o2 #include<bits/stdc++ ...

  6. 【代码笔记】iOS-cell自动变化大小

    一,效果图. 二,工程图. 三,代码. RootViewController.h #import <UIKit/UIKit.h> @interface RootViewController ...

  7. springboot 文件上传和下载

    文件的上传和下载 1.文件上传 html页面代码如下 <form method="post" action="/file/upload1" enctype ...

  8. 规划行业GIS云平台“城智图”上线运行

    首先祝各位朋友中秋节快乐! 城智图(www.imapcity.com)是远景GIS云平台的首个应用项目,它以全新的方式为规划部门提供地理信息服务,改变了以前规划部门只有CAD成果数据,难以查阅.深入挖 ...

  9. immutable.js 在React、Redux中的实践以及常用API简介

    immutable.js 在React.Redux中的实践以及常用API简介 学习下 这个immutable Data 是什么鬼,有什么优点,好处等等 mark :  https://yq.aliyu ...

  10. linux 用户管理命令useradd、passwd、who、whoami、id、w及创建用户默认值文件

    useradd /usr/sbin/useradd执行权限:rootuseradd [选项] 用户名-u UID:手工指定用户的UID号-d 家目录:手工指定用户的家目录-c 用户说明:手工指定用户的 ...