由于<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. NIO 多人聊天室

    一前言 在家休息没事,敲敲代码,用NIO写个简易的仿真聊天室.下面直接讲聊天室设计和编码.对NIO不了解的朋友,推荐一个博客,里面写的很棒: https://javadoop.com/     里面有 ...

  2. 【HAOI2015】 T1

    为什么感觉越来越迷了X. X 原题: 有一棵点数为 N 的树,树边有边权.给你一个在 0~N 之内的正整数 K,你要在这棵树中选择 K 个点,将其染成黑色,并将其他的N-K 个点染成白色.将所有点染色 ...

  3. Vue v-text和v-html的区别

    v-text和v-html的区别 v-text:会把html的标签输出 v-html:不会把html的标签输出 比如: <template> <div id="app&qu ...

  4. prufer数列

    涨姿势---prufer数列 一. 简介 Prufer数列是无根树的一种数列.在组合数学中,Prufer数列由有一个对于顶点标过号的树转化来的数列,点数为n的树转化来的Prufer数列长度为n-2.它 ...

  5. Centos7安装32位库用来安装32位软件程序

    打算在centos7上安装一个远程控制软件,发现teamviewer只有centos的32位版本,试着安装了一下,各种报错,尝试多次无果.于是试着用向日葵远程控制软件,也报错,貌似也是只支持32位. ...

  6. 基于lfslivecd-x86-6.3-r2145安装vnc和qemu

    文章目录 把lfslivecd复制到硬盘上使用 编译安装vnc 前后下载了多个软件包进行编译安装 编译VNC 启动VNC 编译安装qemu 启动VNC客户端并连接虚拟机的vncviewer 把lfsl ...

  7. JDK8新增时间类型用在JPA中的问题

    之前数据库存储日期时间类型时一般POJO实体对应属性为java.util.Date,然后通过JPA注解指定它是日期格式或是日期时间格式,JDK8中新增了更好的时间API,如表示本地日期的LocalDa ...

  8. Qt开发问答

    Qt开发问答 1, Difference between Dialog and widget and QMainWindow http://www.qtcentre.org/threads/3465- ...

  9. HTMLParser 笔记

    # 关于html.parse.HTMLParser的使用 from html.parser import HTMLParser class MyHtmlParser(HTMLParser): # 使用 ...

  10. Go thrift使用举例

    thrift 最初是 facebook 开发使用的 rpc 通信框架,后来贡献给了 apache 基金会,出来得比较早,几乎支持所有的后端语言,使用非常广泛,是不可不知的一个网络框架. 和 grpc ...