只需要在head中增加如下代码即可

<head>

{#设置背景#}

    <style>

        body {

            height: 100%;width: 100%;

            background: url("{% static 'img/abc-1.jpg'%}");

            background-size:cover;

        }

    </style>

</head>

HTML:给body增加全屏的背景图的更多相关文章

  1. HTML5轻松实现全屏视频背景

    想在你的网页首页中全屏播放一段视频吗?而这段视频是作为网页的背景,不影响网页内容的正常浏览.那么我告诉你有一款Javascript库正合你意,它就是Bideo.js. 参考网址: https://ww ...

  2. tinymce插件preview改造增加全屏按钮

    近期需要用到tinymce的preview插件,但preview出来的界面太小了,通过投影仪出来看的不清晰,于是想在preview的预览界面中增加全屏.放大和缩小的按钮,改造内容如下: 由于previ ...

  3. 基于js全屏动画焦点图幻灯片

    今天给大家分享一款基于js全屏动画焦点图幻灯片.这款焦点图内的内容以动画形式出现和消失.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class="sl ...

  4. 最全面的DialogFragment的使用，实现DialogFragment全屏、背景透明；

    Android推荐使用DialogFragment代替Dialog,好处就说一点吧,DialogFragment就是个盖在界面上的Fragment,它拥有Fragment一样的功能和生命周期,解决普通 ...

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

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

  6. JFrame 实现全屏透明背景

    JFrame f=new JFrame(); f.setUndecorated(true);        f.setBackground(new Color(0,0,0,0));        To ...

  7. Delphi下实现全屏快速找图找色

    前言 最近有好几个朋友都在问我找图找色的问题,奇怪?于是乎写了一个专门用于找图找色的单元文件“BitmapData.pas”.在这个单元文件中我实现了从文件中导入位图.屏幕截图.鼠标指针截图.在图片上 ...

  8. Swiper 移动端全屏轮播图效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  9. html-css控制背景图全屏拉伸不重复显示

    在HTML中,当我们设置背景图,只能采用是否重叠.居中.重叠方向这几个选项 CSS3中设置 body { background:#3d71b8 url(../back_main.png); backg ...

随机推荐

  1. C++函数调用方式约定stdcall,cdecl,pascal,naked,thiscall,fastcall

    https://www.cnblogs.com/xiangtingshen/p/11014514.html C++函数调用约定_cdecl约定:参数:从右向左依次入栈堆栈平衡:调用方平衡 #inclu ...

  2. 数据库三大范式（1NF,2NF,3NF）及ER图

    数据库三大范式(1NF,2NF,3NF)及ER图 百度官方解释: 设计关系数据库时,遵从不同的规范要求,设计出合理的关系型数据库,这些不同的规范要求被称为不同的范式,各种范式呈递次规范,越高的范式数据 ...

  3. codevs1504愚蠢的组合数 / RQNOJ愚蠢的组合数

    1504 愚蠢的组合数  时间限制: 2 s  空间限制: 128000 KB  题目等级 : 黄金 Gold 题解       题目描述 Description 最近老师教了狗狗怎么算组合数,狗狗又 ...

  4. 【概率论】5-9:多项式分布(The Multinomial Distributions)

    title: [概率论]5-9:多项式分布(The Multinomial Distributions) categories: - Mathematic - Probability keywords ...

  5. 《挑战30天C++入门极限》C++面向对象编程入门：构造函数与析构函数

        C++面向对象编程入门:构造函数与析构函数 请注意,这一节内容是c++的重点,要特别注意! 我们先说一下什么是构造函数. 上一个教程我们简单说了关于类的一些基本内容,对于类对象成员的初始化我们 ...

  6. C#/Java 常用轮子 (子文章)(持续更新)

    -----> 总文章 入口 C# 框架/类库名称 介绍 Topshelf windows服务框架 Quartz 定时任务框架 NVelocity MVC视图引擎 NPOI 文档读写 Signal ...

  7. Nodejs技巧之---Exceljs

    工作中我们可能会遇到制作表格的需求,那么针对nodejs如何制作一个汇总表格呢? 今天我们就在此介绍下exceljs的基本使用,应该可以满足我们大部分的需求. 第一部分 下载 npm install ...

  8. ICEM-点火器

    原视频下载地址:https://pan.baidu.com/s/1hrU75So 密码: k6nc

  9. 震惊，hexo个人博客居然有这么方便的评论系统

    论文搞得一头火,瞎倒腾了一下,没想到几分钟给自己的博客换了个评论系统. 之前用的gitalk,需要依赖github,死活没有成功,而且评论者还需要登录github才可以评论,不好用,刚才偶然间发现va ...

  10. JVM相关文章和GC原理算法

    参考推荐: Java内存模型及GC原理 一个优秀的Java程序员必须了解的GC机制 Android 智能指针原理(推荐) Java虚拟机规范 Java虚拟机参数 Java内存模型 Java系列教程(推 ...