由于<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. Visual Studio 2019 RC

    Visual Studio 2019 RC入门 介绍 在本文中,让我们看看如何开始使用Visual Studio 2019 RC.Microsoft现已发布Visual Studio Release ...

  2. HDU 4639 Hehe 2013 Multi-University Training Contest 4

    题意大致如下:屌丝找女神聊天,女神回了一句 hehe ,而我们都知道 Hehe 有两个意思,一个就是 Hehe ,另外一个则是 wqnmlgb (我去年买了个表) ,所以屌丝很纠结,于是开始思考到底女 ...

  3. #505 1&2 A-C 后面未完成

    A. Doggo Recoloring 题目意思是给一个字符串(都是小写字母),如果有两个字符相同,我们可以将这两个字符变成其他字符,问能不能使字符串字母都一样 思路  有两个相同字符时就能:  字符 ...

  4. EHCache学习

    EhCache 基础知识 吐嘈 clusteredShared的size会直接占用内存,而不是像redis那用动态的增大 clusteredDedicated能够动态增大,但是还是必须指定每个cach ...

  5. hdu3294 Girls' research manacher

    One day, sailormoon girls are so delighted that they intend to research about palindromic strings. O ...

  6. python英文与中文的词频统计

    1.统计英文单词, # 1.准备utf-8编码的文本文件file(已在文件夹中定义了 一个名叫“head.txt.rtf”文本文件,详情请见截图) def getTxt(): #3对文本预处理(包括) ...

  7. 将koa+vue部署到服务器

    很久很久以前,就对前后端如何分离,后端如何把代码部署到服务器有浓厚的兴趣,最近在阿里云上申请了一个服务器,试试水吧! 本文参考了文章<基于Node的Koa2项目从创建到打包到云服务器指南> ...

  8. ORM 创建manytomay的三种方法 反向查询 和一些 双下方法版学员管理系统3

    老师信息管理   三种创建多对对外键的方式常用第二种和第三种 思考 三种方式创建多对多外键方式及其优缺点. 外键的查询和使用 1外键的创建: 在数据库表中的表现形式 如何连表查询和使用 表里边:  s ...

  9. 简单 babel plugin 开发-使用lerna 工具

    babel在现在的web 应用开发上具有很重要的作用,帮助我们做了好多事情,同时又有 比较多的babel plugin 可以解决我们实际开发上的问题. 以下只是学习下如果编写一个简单的babel pl ...

  10. sqler sql 转rest api 的docker 镜像构建（续）使用源码编译

    sqler 在社区的响应还是很不错的,已经添加了好多数据库的连接,就在早上项目的包管理还没有写明确, 下午就已经有go mod 构建的支持了,同时也调整下docker 镜像的构建,直接使用git cl ...