搜索

首页  >  问答  >  正文

背景图像上的响应式 PNG 图像?

我正在尝试制作这样的页面设计:点击

事实上,我成功了。问题是,当我更改网页的分辨率时,元素重叠,背景 div 和 PNG 的行为不同,一切看起来都很糟糕。 (我尝试过使用位置:绝对(PNG)和位置:相对(背景))

P粉107991030P粉107991030352 天前487

全部回复(1)我来回复

  • P粉011360903

    P粉0113609032024-02-22 13:30:03

    您可以使用 background-sizebackground-position CSS 属性。你应该尝试这种方式:

    body {
      background-image: url("your-bg-image.jpg");
      background-size: cover;
      background-position: center;
    }
    
    .responsive-image {
      background-image: url("your-image.png");
      background-size: contain;
      background-position: center;
      width: 100%;
      height: 100%;
    }

    回复
    0
  • 取消回复