HTML中使背景图片自适应浏览器大小
由于<body>标签的图片不能够拉伸,
解决办法:
1、图片不够大,又background属性不能拉伸图片;
2、只能用个div,把其z-index值设为负,并使这个div大小为整个body大小,在div里用<img>
3、body的background属性去掉,要不然会被遮住
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>background</title>
<style>
* {
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="Layer1" style="position:absolute; width:100%; height:100%; z-index:-1">
<img src="imgs/back.jpg" height="100%" width="100%"/>
</div>
</body>
</html>
HTML中使背景图片自适应浏览器大小的更多相关文章
- css 背景图片自适应元素大小
一.一种比较土的方法,<img>置于底层. 方法如下: CSS代码: HTML: <img src="背景图片路径" /> <span>字在背景 ...
- css -- 背景图片自适应屏幕大小
由于<body>标签的图片不能够拉伸, 解决办法: 1.图片不够大,又background属性不能拉伸图片: 2.只能用个div,把其z-index值设为负,并使这个div大小为整个bod ...
- css 背景图片自适应分辨率大小 兼容
拉伸,all浏览器兼容.bg{ background:url(http://wyz.67ge.com/wp-content/uploads/qzlogo.jpg); filter:&q ...
- html/css背景图片自适应分辨率大小
<style type='text/css'> .bgbox { position: absolute; left: 0; top: 0; width: 100%; overflow: h ...
- 【Python全栈-CSS】CSS实现网页背景图片自适应全屏
CSS实现网页背景图片自适应全屏 功能:实现能自适应屏幕大小又不会变形的背景大图,而且背景图片不会随着滚动条滚动而滚动. 以下是用CSS实现的方法: <html> <head> ...
- css网页中设置背景图片的方法详解
在css代码中设置背景图片的方法,包括背景图片.背景重复.背景固定.背景定位等 用css设置网页中的背景图片,主要有如下几个属性: 1,背景颜色 {">说明:参数取值和颜色属性一样 ...
- bootstrop设置背景图片自适应屏幕
如果不用bootstrop框架,想让背景图片自适应窗口大小,可以这样做: <style type="text/css"> html{height: %;} body.a ...
- css如何使背景图片水平居中
CSS中定位背景图片的属性是:background-position,用法background-position 属性设置背景图像的起始位置. 你要水平居中可以: div{background-pos ...
- css自适应浏览器大小
css自适应浏览器大小 1.屏幕 > 900px :显示3列 2.450px < 屏幕 < 900px :显示2列 3.屏幕 < 450px :显示1列 <!DOCTYP ...
随机推荐
- java类
1.四种访问控制符 private.不指明.protected.public 2.构造函数没有返回值 是因为构造函数默认返回的是类的实例对象.所以不需要写返回值 3.static static表示类拥 ...
- Word2013中制作按钮控件
1.由于“开发工具”不经常用,所以在功能选项面板中没有“开发工具”这一栏.所以我们需要设置.在功能选项面板中选择“文件”,在跳转出来的版面中选择“选项”.
- UVALive 7146 Defeat the Enemy(贪心+STL)(2014 Asia Shanghai Regional Contest)
Long long ago there is a strong tribe living on the earth. They always have wars and eonquer others. ...
- 修改项目生成Gemfile的模板
修改项目生成Gemfile的模板 gedit $rvm_path/gems/ruby-2.1.5/gems/railties-4.1.8/lib/rails/generators/rails/app/ ...
- response.write();改变页面布局的原因及解法
Response.Write ,在ASP.NET 中不要随便使用 Response.Write,其原因是它会打乱 ASP.NET 的输出流顺序,在aspx.cs 中使用 Response.Write ...
- 图说js中的this——深入理解javascript中this指针
没搞错吧!js写了那么多年,this还是会搞错!没搞错,javascript就是回搞错! ………… 文章来源自——周陆军的个人网站:http://zhoulujun.cn/zhoulujun/html ...
- ubuntu vim8.0源码安装
安装篇 从https://github.com/vim/vim下载相应zip源码文件,利用unzip vim-master.zip 命令解压到当前用户目录,即~: 解压后进入vim的src目录,首先, ...
- 剑指offer:赋值运算符函数和复制构造函数
赋值运算符函数 对于定义一个赋值运算符函数时,需要注意一下几点: (1)函数的返回类型必须是一个引用,因为只有返回引用,才可以连续赋值 (2)传入的参数声明为常量引用,可以提高代码效率,同时赋值运算函 ...
- 最常用的ES6特性
遇到了要写出es6新特性的题目,所以查阅了资料来总结一下,点击查看原文. 进入正题,最常用的ES6特性有:let, const, class, extends, super, arrow functi ...
- (转)jQuery源码解读 -- jQuery v1.10.2
原文GitHub链接: https://github.com/chokcoco/jQuery-