由于<body>标签的图片不能够拉伸，

解决办法：

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

2、只能用个div，把其z-index值设为负，并使这个div大小为整个body大小，在div里用<img> 3、body的background属性去掉，要不然会被遮住

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>hello world</title>

</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>

css -- 背景图片自适应屏幕大小的更多相关文章

  1. css 背景图片自适应元素大小

    一.一种比较土的方法,<img>置于底层. 方法如下: CSS代码: HTML: <img src="背景图片路径" /> <span>字在背景 ...

  2. html/css背景图片自适应分辨率大小

    <style type='text/css'> .bgbox { position: absolute; left: 0; top: 0; width: 100%; overflow: h ...

  3. css 背景图片自适应分辨率大小 兼容

    拉伸,all浏览器兼容.bg{     background:url(http://wyz.67ge.com/wp-content/uploads/qzlogo.jpg);     filter:&q ...

  4. bootstrop设置背景图片自适应屏幕

    如果不用bootstrop框架,想让背景图片自适应窗口大小,可以这样做: <style type="text/css"> html{height: %;} body.a ...

  5. html 网页背景图片根据屏幕大小CSS自动缩放

    https://blog.csdn.net/coslay/article/details/47109281 腾讯微博和QQ空间的登录背景图片是根据访客的屏幕大小自动缩放的,但是好像是用JQuery代码 ...

  6. picturefill + picture 标签 实现兼容性很棒的 响应式图片 自适应 屏幕大小

    polyfill 它是一个能够补齐浏览器兼容性问题的一个东西,使用到的<picture></picture>标签 ,并不是所有浏览器都支持,为了实现更好的兼容效果,这里就使用到 ...

  7. H5 背景图片自适应屏幕问题解决办法

    今天也是偶然遇到这个问题的,平成很少用到关于css的内容,就在网上找了很多个方法,最后总结以下几种很实用的方法 方法1: <style> body{ background:url(beij ...

  8. HTML中使背景图片自适应浏览器大小

    由于<body>标签的图片不能够拉伸, 解决办法: 1.图片不够大,又background属性不能拉伸图片: 2.只能用个div,把其z-index值设为负,并使这个div大小为整个bod ...

  9. css 背景图片自适应

    body{ height:100%; overflow:hidden;} .bg { background-image: url(../../img/beijing.jpg); width:100%; ...

随机推荐

  1. spring mvc 依赖包

    <dependency> <groupId>org.springframework</groupId> <artifactId>spring-aop&l ...

  2. 依据经纬度返回地址的url -- GoogleMap

    latlng=34,112">https://maps.googleapis.com/maps/api/geocode/xml? latlng=34,112

  3. Servlet和Android网络交互基础（3）

    在上一章中採用了最简单的创建service端代码方式,但在实际开发中一般都会採用比較成熟的框架.以下是完整的maven+spring mvc 创建service的方式 下载安装Eclipse 和jdk ...

  4. 批处理学习笔记8 - 深入学习For命令1

    for命令用途非常广,它分为4种 /d /r /l /f /l是类似高级语言的数值循环,在之前就说过,这篇就不说了: http://www.cnblogs.com/HONT/p/3155187.htm ...

  5. [svc][op]磁盘Inode详解-重要

    另一篇白话总结 一.inode是什么 理解inode,要从文件储存说起. 文件储存在硬盘上,硬盘的最小存储单位叫做"扇区"(Sector).每个扇区储存512字节(相当于0.5KB ...

  6. mysql插入中文时候编码问题

    mysql插入中的时候要设置 set character_client_set = utf-8

  7. angular学习笔记(九)-css类和样式1

    本篇主要介绍通过数据绑定来给元素添加特定的类名,从而应用特定的样式 从一个最基本的例子来看: <!DOCTYPE html> <html ng-app> <head> ...

  8. WEB开发的标准目录结构

    刚才在书上看到的,感觉很重要,简单做个笔记 把你的jsp.css.js代码分别放到3个文件夹中(这3个文件夹就名为jsp,css,js),文件夹中设置子目录,这些子目录最好命名与html文件的子目录命 ...

  9. iOS runtime探究(二): 从runtime開始深入理解OC消息转发机制

    你要知道的runtime都在这里 转载请注明出处 http://blog.csdn.net/u014205968/article/details/67639289 本文主要解说runtime相关知识, ...

  10. 【火狐FireFox】同步失败后，书签被覆盖，如何恢复书签

    问题场景: 使用公司的电脑,下载安装火狐,登录个人帐号后,火狐会自动开始同步书签.但有时候会同步失败,比如登录之前选的是[本地服务],而最新的书签都是在[全球服务]理,那么很有可能同步到的是N久之前的 ...