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

解决办法：

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

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <title>hello world</title>
  6. </head>
  7. <body>
  8. <div id="Layer1" style="position:absolute; width:100%; height:100%; z-index:-1">
  9. <img src="pictures/background.jpg" height="100%" width="100%"/>
  10. </div>
  11. </body>
  12. </html>

细节：../ 表示的是返回上一级目录访问 tuxiang/ 表示访问的是同级目录中的tuxian

HTML背景图片自适应的更多相关文章

  1. 【Python全栈-CSS】CSS实现网页背景图片自适应全屏

    CSS实现网页背景图片自适应全屏 功能:实现能自适应屏幕大小又不会变形的背景大图,而且背景图片不会随着滚动条滚动而滚动. 以下是用CSS实现的方法: <html> <head> ...

  2. 基于html5背景图片自适应代码

    基于html5背景图片自适应代码是一款背景不随滚动条滚动,会根据分辨率不同自动匹配对应的背景图片.效果图如下: 在线预览   源码下载 实现的代码. css代码: .jawbone-hero .jaw ...

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

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

  4. CSS实现网页背景图片自适应全屏

    一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块露白,简而言之,就是实现能自适应屏幕大小又不会变形 ...

  5. css设置背景图片自适应

      CreateTime--2017年12月25日16:36:07 Author:Marydon 控制背景图片100%自适应填充布局 /* 控制背景图片100%自适应填充布局 */ body{ bac ...

  6. CSS实现网页背景图片自适应全屏,自适应背景图片

    一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块露白,简而言之,就是实现能自适应屏幕大小又不会变形 ...

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

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

  8. 背景图片自适应整个页面CSS+DIV

    <body style="overflow:hidden;"> <div class="wrapper"> <!--背景图片--& ...

  9. div背景图片自适应

    对背景图片设置属性:background-size:cover;可以实现背景图片适应div的大小. background-size有3个属性: auto:当使用该属性的时候,背景图片将保持100% 的 ...

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

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

随机推荐

  1. 一道dp[不太好写]

    http://acm.csu.edu.cn:20080/csuoj/problemset/problem?pid=2281 Description An arithmetic progression ...

  2. 【状压DP】【HDOJ1074】

    http://acm.hdu.edu.cn/showproblem.php?pid=1074 Doing Homework Time Limit: 2000/1000 MS (Java/Others) ...

  3. 《DSP using MATLAB》Problem 5.32

    代码: function [y] = ovrlpadd_v3(x, h, N) %% Overlap-Add method of block convolution %% -------------- ...

  4. day 50 Java Script 学习

    前端基础之JavaScript   JavaScript概述 JavaScript的历史 1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言(最初绑定在CEnvi软件中) ...

  5. 07机器学习实战k-means

    K-Means原理初探 K-Means算法的思想很简单,对于给定的样本集,按照样本之间的距离大小,将样本集划分为K个簇.让簇内的点尽量紧密的连在一起,而让簇间的距离尽量的大. 如果我们想直接求上式的最 ...

  6. 推荐一篇文章 《为什么C语言不会过时？》

    <为什么C语言不会过时?>    文章地址 : https://mp.weixin.qq.com/s?__biz=MzAxOTc0NzExNg==&mid=2665515153&a ...

  7. taro 事件处理

    https://nervjs.github.io/taro/docs/event.html Taro 元素的事件处理和 DOM 元素的很相似.但是有一点语法上的不同: Taro 事件绑定属性的命名采用 ...

  8. pycharm Process finished with exit code (0xC0000005)

    pycharm  Process finished with exit code  (0xC0000005)解决办法 上次报过这个错误,是在安装浏览器时发现的,报过同样的错误.按当时的方法,以为切地解 ...

  9. 1.初步认识TypeScript

    简介:typescript是C#之父主导的一门语言,本质上是向Javascript语言添加了可选的静态类型和基于面向对象的诸多特性.相当于javascript的超集,其包含es6.由于是和C#之父创造 ...

  10. 学习大数据基础框架hadoop需要什么基础

    什么是大数据?进入本世纪以来,尤其是2010年之后,随着互联网特别是移动互联网的发展,数据的增长呈爆炸趋势,已经很难估计全世界的电子设备中存储的数据到底有多少,描述数据系统的数据量的计量单位从MB(1 ...