编程 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 相关文章推荐

基于jQuery判断两个元素是否有重叠部分的代码

Jul 25 Javascript

jQuery动态显示和隐藏datagrid中的某一列的方法

Dec 11 Javascript

对table和ul实现js分页示例分享

Feb 24 Javascript

js实现获取焦点后光标在字符串后

Sep 17 Javascript

基于jQuery实现多层次的手风琴效果附源码

Sep 21 Javascript

JavaScript类型系统之Object详解

Jan 07 Javascript

angularJS实现动态添加,删除div方法

Feb 27 Javascript

vue 解决文本框被键盘遮住的问题

Nov 06 Javascript

js实现简单的日历显示效果函数示例

Nov 25 Javascript

详解Vue 数据更新了但页面没有更新的 7 种情况汇总及延伸总结

May 28 Javascript

JS数据类型分类及常用判断方法

Nov 19 Javascript

关于React Native使用axios进行网络请求的方法

Aug 02 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

Yii 快速，安全，专业的PHP框架

2014/09/03 PHP

详解PHP的Yii框架中的Controller控制器

2016/03/29 PHP

Linux下安装Memcached服务器和客户端与PHP使用示例

2019/04/15 PHP

Mootools 1.2教程同时进行多个形变动画

2009/09/15 Javascript

js动态为代码着色显示行号

2013/05/29 Javascript

超炫的jquery仿flash导航栏特效

2014/11/11 Javascript

javascript实现继承的简单实例

2015/07/26 Javascript

实例讲解js验证表单项是否为空的方法

2016/01/09 Javascript

基于NodeJS+MongoDB+AngularJS+Bootstrap开发书店案例分析

2017/01/12 NodeJs

原生javascript实现读写CSS样式的方法详解

2017/02/20 Javascript

详谈js中数组(array)和对象(object)的区别

2017/02/27 Javascript

从零学习node.js之详解异步控制工具async（八）

2017/02/27 Javascript

详谈jQuery中的一些正则匹配表达式

2017/03/08 Javascript

JS闭包可被利用的常见场景小结

2017/04/09 Javascript

js实现日期显示的一些操作(实例讲解)

2017/07/27 Javascript

Web开发使用Angular实现用户密码强度判别的方法

2017/09/27 Javascript

trackingjs+websocket+百度人脸识别API实现人脸签到

2018/11/26 Javascript

详解easyui 切换主题皮肤

2019/04/04 Javascript

在vue项目中使用sass语法问题

2019/07/18 Javascript

layui表单提交到后台自动封装到实体类的方法

2019/09/12 Javascript

详解Vue中的Props与Data细微差别

2020/03/02 Javascript

python轻松查到删除自己的微信好友

2016/01/10 Python

python编程实现12306的一个小爬虫实例

2017/12/27 Python

python安装numpy和pandas的方法步骤

2019/05/27 Python

Python进阶之迭代器与迭代器切片教程

2020/01/29 Python

python随机模块random使用方法详解

2020/02/14 Python

Python将list元素转存为CSV文件的实现

2020/11/16 Python

HTML5 video 上传预览图片视频如何设置、预览视频某秒的海报帧

2018/08/28 HTML / CSS

美国旅游网站：Tours4Fun

2017/02/17 全球购物

印尼极简主义和实惠的在线家具店：Fabelio

2019/03/27 全球购物

药学专业个人的自我评价

2013/12/31 职场文书

中学生关于梦想的演讲稿

2014/08/22 职场文书

酒桌上的开场白

2015/06/01 职场文书

2016年12月份红领巾广播稿

2015/12/21 职场文书

正则表达式拆分url实例代码

2022/02/24 Java/Android

mysql使用 not int 子查询隐含陷阱

2022/04/12 MySQL