首页 > 代码库 > html5图片高度自适应解决方法
html5图片高度自适应解决方法
今天遇到一个HTML5图片高度自适应各个设备问题，网上找到一个解决方法，跟大家分享下。
由于<body>标签的图片不能够拉伸，
解决办法：
1、图片不够大，又background属性不能拉伸图片；
2、只能用个div，把其z-index值设为负，并使这个div大小为整个body大小，在div里用<img>
3、body的background属性去掉，要不然会被遮住。
<!DOCTYPE HTML><html><head><meta charset="utf-8" /><title>Hello World</title><meta content="width=640, target-densitydpi=320, user-scalable=no" name="viewport" /> <meta name="apple-mobile-web-app-capable" content="yes" /><meta name="apple-mobile-web-app-status-bar-style" content="black" /><meta content="telephone=no" name="format-detection" /></head> <body> <div id="Layer1" style="position:absolute; width:100%; height:100%; z-index:-1"> <img src="pictures/background.jpg" height="100%" width="100%"/> </div> </body> </html>
——非原创，摘自CSDN。
html5图片高度自适应解决方法
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。