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

时间：2022-12-15 17:05:15

由于<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中使背景图片自适应浏览器大小的更多相关文章

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

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

  2. css -- 背景图片自适应屏幕大小

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

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

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

  4. html&sol;css背景图片自适应分辨率大小

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

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

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

  6. css网页中设置背景图片的方法详解

    在css代码中设置背景图片的方法,包括背景图片.背景重复.背景固定.背景定位等   用css设置网页中的背景图片,主要有如下几个属性: 1,背景颜色 {">说明:参数取值和颜色属性一样 ...

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

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

  8. css如何使背景图片水平居中

    CSS中定位背景图片的属性是:background-position,用法background-position 属性设置背景图像的起始位置. 你要水平居中可以: div{background-pos ...

  9. css自适应浏览器大小

    css自适应浏览器大小 1.屏幕 > 900px :显示3列 2.450px < 屏幕 < 900px :显示2列 3.屏幕 < 450px :显示1列 <!DOCTYP ...

随机推荐

  1. Python任务调度模块 – APScheduler

    APScheduler是一个Python定时任务框架,使用起来十分方便.提供了基于日期.固定时间间隔以及crontab类型的任务,并且可以持久化任务.并以daemon方式运行应用.目前最新版本为3.0 ...

  2. 获取Linux主机的CPU、内存、主板、BIOS的信息&lpar;Centos&rpar;

    #!/usr/bin/env python #coding:utf-8 import subprocess import re def Cmd_Exec(cmd): ''' 执行获取信息命令 :par ...

  3. EXCEL某列长度超过255个字符导入SQL SERVER的处理方法

    问题描述: [Excel 源 [1]] 错误: 输出“Excel 源输出”(9) 上的 输出列“Description 3”(546) 出错.返回的列状态是:“文本被截断,或者一个或多个字符在目标代码 ...

  4. New Valid Tracking Metric Now Available in Seller Central

    On July 7, Amazon added Valid Tracking Rate as a new metric in Seller Central. This metric shows the ...

  5. Brief introduction to Scala and Breeze for statistical computing

    Brief introduction to Scala and Breeze for statistical computing 时间 2013-12-31 03:17:19  Darren Wilk ...

  6. bat批处理延迟运行脚本&lpar;zz&rpar;

    @echo off:aaapause 这里是你需要运行的程序for /l %%i in (0,1,10000) do echo %%i>nulgoto aaa 当然bat延迟运行还有其他的一些方 ...

  7. Qt国际化详细介绍，中文乱码以及解决方案

    Qt国际化的一般步骤 运行 lupdate,从应用程序的代码中提取所有界面上的可见字符.        这些可见字符必须被 tr() .QCoreApplication::translate().Qt ...

  8. MVC和三层架构的区别

    MVC是一种设计模式,Modal,View,Controller,三层分开,解开耦合,方便替换. 三层架构包括 UI层,业务逻辑层,Dao层.UI层负责展示数据,业务逻辑层具体处理数据,Dao层负责和 ...

  9. EffectiveC&plus;&plus; 第1章 让自己习惯C&plus;&plus;

    我根据自己的理解,对原文的精华部分进行了提炼,并在一些难以理解的地方加上了自己的"可能比较准确"的「翻译」. Chapter 1 让自己习惯C++ 条款 1 :视 C++为一个语言 ...

  10. 【UVa】1374 Power Calculus（IDA&ast;）

    题目 题目     分析 IDA*大法好,抄了lrj代码.     代码 #include <cstdio> #include <cstring> #include <a ...

相关文章