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建站的达人们也可以用此方法,在指定页面定制自己的背景图片。

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

Javascript 相关文章推荐
jquery获取input的value问题说明
Aug 19 Javascript
JavaScript异步调用定时方法并停止该方法实现代码
Mar 16 Javascript
简单几行JS Code实现IE邮件转发新浪微博
Jul 03 Javascript
jQuery使用drag效果实现自由拖拽div
Jun 11 Javascript
点击页面任何位置隐藏div的实现方法
Sep 05 Javascript
微信小程序 闭包写法详细介绍
Dec 14 Javascript
js实现PC端和移动端刮卡效果
Mar 27 Javascript
js使用ajax传值给后台,后台返回字符串处理方法
Aug 08 Javascript
vue项目在安卓低版本机显示空白的原因分析(两种)
Sep 04 Javascript
vue服务端渲染添加缓存的方法
Sep 18 Javascript
vue-form表单验证是否为空值的实例详解
Oct 29 Javascript
详解三种方式在React中解决绑定this的作用域问题并传参
Aug 18 Javascript
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 COOKIE及时生效的方法介绍
2014/02/14 PHP
PHP模板引擎Smarty中变量的使用方法示例
2016/04/11 PHP
php实现xml与json之间的相互转换功能实例
2016/07/07 PHP
PHP cookie与session会话基本用法实例分析
2019/11/18 PHP
showModelessDialog()使用详解
2006/09/07 Javascript
简明json介绍
2008/09/28 Javascript
jQuery获得内容和属性方法及示例
2013/12/02 Javascript
用js一次改变多个input的readonly属性值的方法
2014/06/11 Javascript
使用纯javascript实现经典扫雷游戏
2015/04/23 Javascript
jquery ajax双击div可直接修改div中的内容
2016/03/04 Javascript
jQuery使用animate实现ul列表项相互飘动效果示例
2016/09/16 Javascript
js手动播放图片实现图片轮播效果
2016/09/17 Javascript
ES6新特性之Object的变化分析
2017/03/31 Javascript
关于vue.js过渡css类名的理解(推荐)
2017/04/10 Javascript
微信小程序 开发之全局配置
2017/05/05 Javascript
Vue中的数据监听和数据交互案例解析
2017/07/12 Javascript
Vue 事件的$event参数=事件的值案例
2021/01/29 Vue.js
[41:37]DOTA2北京网鱼队选拔赛——冲击职业之路
2015/04/13 DOTA
Python语言编写电脑时间自动同步小工具
2013/03/08 Python
Python学习思维导图(必看篇)
2017/06/26 Python
python如何在循环引用中管理内存
2018/03/20 Python
python 统计数组中元素出现次数并进行排序的实例
2018/07/02 Python
如何利用pygame实现简单的五子棋游戏
2019/12/29 Python
解决Keras TensorFlow 混编中 trainable=False设置无效问题
2020/06/28 Python
django下创建多个app并设置urls方法
2020/08/02 Python
HTML5在IE10、火狐下中文乱码问题的解决方法
2013/11/18 HTML / CSS
英语专业毕业生求职简历的自我评价
2013/10/24 职场文书
女大学生自我鉴定
2013/12/09 职场文书
珍珠鸟教学反思
2014/02/01 职场文书
青年志愿者先进事迹
2014/05/06 职场文书
小学竞选班长演讲稿
2014/09/09 职场文书
公司收款委托书范本
2014/09/20 职场文书
初中政治教师教学反思
2016/02/23 职场文书
英语版自我评价,35句话轻松搞定
2019/10/08 职场文书
PyTorch dropout设置训练和测试模式的实现
2021/05/27 Python
python字符串的多行输出的实例详解
2021/06/08 Python