源码论坛,商业源码下载,尽在锦尚中国商业源码论坛

标题: 如何在div中设置背景图片并且自适应div大小? [打印本页]
作者: 洪七公    时间: 2023-7-26 20:23
标题: 如何在div中设置背景图片并且自适应div大小?

参考如下代码，设置背景图片的大小为100% 100%并且设置no-repeat

这样图片就能在div改变的情况下，仍然显示完全
  1. <!DOCTYPE html>
  2. <html>

  4. <head>
  5.     <style>
  6.         #a {
  7.             background-color: rgb(255, 208, 0);
  8.             background-image: url("1.png");
  9.             background-size: 100% 100%;
  10.             background-repeat: no-repeat;
  11.             position: absolute;
  12.             padding: 0px;
  13.             width: 100%;
  14.             height: 15%;
  15.             top: 0;
  16.             left: 0;
  17.         }
  18.     </style>
  19. </head>

  21. <body>
  22.     <!--
  23.         height和width只是设置标签的大小，标签的距离通过top和left属性设置
  24.         absolute相对于已经定位包含关系最近的祖先元素(body相对于网页)
  25.         relative则是相对于元素自身正常的初始位置而言，也就是理论上正常的位置而言
  26.     -->
  27.     <div id="a">
  28.     </div>
  29. </body>

  31. </html>
复制代码




欢迎光临 源码论坛,商业源码下载,尽在锦尚中国商业源码论坛 (https://bbs.52jscn.com/) Powered by Discuz! X3.3