编程 Javascript

HTML中使背景图片自适应浏览器大小实例详解

Posted in Javascript onApril 06, 2017

HTML中使背景图片自适应浏览器大小实例详解

解决办法：

1、图片不够大，又background属性不能拉伸图片；

2、只能用个div，把其z-index值设为负，并使这个div大小为整个body大小，在div里用<img> ；

3、body的background属性去掉，要不然会被遮住。

<html> 
<body> 
<div id="Layer1" style="position:absolute; left:0px; top:0px; width:100%; height:100%"> 
<img src="pictures/background.jpg" width="100%" height="100%"/> 
</div> 
</body> 
</html>

如果想让图片不随浏览器右边滚动条滚动，就用position:fixed属性。wordpress建站的达人们也可以用此方法，在指定页面定制自己的背景图片。

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

HTML中使背景图片自适应浏览器大小实例详解

- Author -

lqh

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

关于IFRAME 自适应高度的研究

Jul 20 Javascript

基于JavaScript 类的使用详解

May 07 Javascript

用js来获取上传的文件名纯粹是为了美化而用

Oct 23 Javascript

利用jQuary实现文字浮动提示效果示例代码

Dec 26 Javascript

javascript 动态创建表格

Jan 08 Javascript

vue,angular,avalon这三种MVVM框架优缺点

Apr 27 Javascript

JavaScript中的对象和原型(一)

Aug 12 Javascript

ES6新特性之Object的变化分析

Mar 31 Javascript

Vue的轮播图组件实现方法

Mar 03 Javascript

详解如何在vue项目中使用eslint+prettier格式化代码

Nov 10 Javascript

js+canvas实现刮刮奖功能

Sep 13 Javascript

ajax jquery实现页面某一个div的刷新效果

Mar 04 jQuery

ES6中的箭头函数实例详解

Apr 06 #Javascript

ES6字符串模板，剩余参数，默认参数功能与用法示例

Apr 06 #Javascript

详谈js遍历集合(Array,Map,Set)

Apr 06 #Javascript

javascript中this用法实例详解

Apr 06 #Javascript

selenium 与 chrome 进行qq登录并发邮件操作实例详解

Apr 06 #Javascript

js遍历获取表格内数据的方法(必看)

Apr 06 #Javascript

JS优化与惰性载入函数实例分析

Apr 06 #Javascript

You might like

PHP中的串行化变量和序列化对象

2006/09/05 PHP

PHP5 面向对象（学习记录）

2009/12/02 PHP

zf框架的session会话周期及次数限制使用示例

2014/03/13 PHP

JS实现图片产生波纹一样flash效果的方法

2015/02/27 Javascript

Yii2使用Bootbox插件实现自定义弹窗

2015/04/02 Javascript

Jquery中的$.each获取各种返回类型数据的使用方法

2015/05/03 Javascript

js实现点击链接后延迟3秒再跳转的方法

2015/06/05 Javascript

最丑的时钟效果！js canvas时钟制作方法

2016/08/15 Javascript

jquery过滤特殊字符',防sql注入的实现方法

2016/08/17 Javascript

简单实现js放大镜效果

2017/07/24 Javascript

layui radio性别单选框赋值方法

2018/08/15 Javascript

解决vue-cli webpack打包后加载资源的路径问题

2018/09/25 Javascript

[48:44]2014 DOTA2国际邀请赛中国区预选赛5.21 TongFu VS HGT

2014/05/22 DOTA

使用Python生成url短链接的方法

2015/05/04 Python

Python中的hypot()方法使用简介

2015/05/18 Python

python函数形参用法实例分析

2015/08/04 Python

浅析Python中元祖、列表和字典的区别

2016/08/17 Python

Python Paramiko模块的安装与使用详解

2016/11/18 Python

浅谈django model的get和filter方法的区别(必看篇)

2017/05/23 Python

python图像处理入门（一）

2019/04/04 Python

使用keras内置的模型进行图片预测实例

2020/06/17 Python

关于Kotlin中SAM转换的那些事

2020/09/15 Python

python3从网络摄像机解析mjpeg http流的示例

2020/11/13 Python

Python环境配置实现pip加速过程解析

2020/11/27 Python

阿拉伯世界最大的电子商务网站：Souq沙特阿拉伯

2016/10/28 全球购物

C面试题

2015/10/08 面试题

25道Java面试题集合

2013/05/21 面试题

葡萄牙语专业个人求职信

2013/12/10 职场文书

技术总监个人的自我评价范文

2013/12/18 职场文书

终止合同协议书

2014/04/17 职场文书

党员承诺书格式

2014/05/21 职场文书

基本公共卫生服务健康教育工作方案

2014/05/22 职场文书

2014小学语文教学工作总结

2014/12/17 职场文书

首席执行官观后感

2015/06/03 职场文书

校园安全教育心得体会

2016/01/15 职场文书

2019新员工试用期转正申请书3篇

2019/08/13 职场文书