Question

不是背景图像的所有图像都无法响应！

尝试最大宽度，徽标，鼠标光标等图像均无响应

<header class=" bg-img bg-image-full">
    <img class = "img-fluid"src="h_img.jpg">
</header>
<div class="container-fluid">
    <img class="logo" src="logo.png" >
</div>
<div class="hero-text">
    <br>
    <h1 style="font-size:49px">WELCOME</h1>
    <h2>TO DELANI STUDIOS</h2>
    <h5>Amazing people are making amazing designs</h5>
</div>
<div>
    <a href="javascript: document.body.scrollIntoView(false);" id=""><img class="mouse" src="mouse_click.png"></a>
</div>

这是CSS

.bg-img {
    background-image: url("hero.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    margin-bottom: 500px;
    max-width: 100%;
}

.logo {
    position: relative;
    margin-top: -2100px;
    margin-left: 630px;
    max-width: 5%;
    height: auto !important;
}

.mouse {
    position: relative;
    margin-top: -1200px;
    margin-left: 670px;
    max-width: 100%;
    height: auto !important;
}

图像具有响应性

Answer 1

检查object-fit属性中的图像：https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit。但是，请注意，某些旧版浏览器不支持该功能。

如何修复徽标不响应

1 个答案: