css全屏背景图片设置,django加载图片路径详解

雪花在空中嬉戏着、飞舞着,它净化了世间的一切尘埃,送走了严冬的寂寞,它自由地来,潇洒地去,多少著名的诗词都赞美过它: "忽如一夜春风来,千树万树梨花开 ",多么俏丽呀! "瑞雪兆丰年 ",它还是丰收的预言家呢!

css全屏背景图片设置,django加载图片路径详解

XML/HTML Code复制内容到剪贴板
  1. <head>
  2. <styletype="text/css">
  3. #bg{
  4. position:fixed;
  5. top:0;
  6. left:0;
  7. width:100%;
  8. height:100%;
  9. }
  10. #bgimg{
  11. position:absolute;
  12. left:0;
  13. right:0;
  14. bottom:0;
  15. margin:auto;
  16. width:100%;
  17. height:100%;
  18. z-index:-1;
  19. }
  20. </style>
  21. </head>
  22. <body>
  23. <divclass="container">
  24. <divid="bg">
  25. <imgsrc="{%static'img/login.jpg'%}"alt="">
  26. </div>
  27. <div>
  28. 添加内容,该内容不会被遮挡,分割
  29. </div>
  30. </body>

以上这篇css全屏背景图片设置,django加载图片路径详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

您可能有感兴趣的文章
CSS如何实现背景图片全屏铺满自适应的3种方式

CSS如何实现fullpage.javascript全屏滚动效果的示例代码

一个全屏的加载动画效果如何实现

浏览器全屏显示背景图片的css样式与html结构

背景图片自适应浏览器分辨率大小并自动拉伸全屏代码