html - 响应图像没有按应有的方式响应

Question

我创建了一个网站，其标题中包含背景图片。我将图像放在 CSS 样式表中。图像的宽度响应很好，但高度却没有。您可以在此处查看该站点:www.devcore.tech

这是我的 HTML:

<div class="introduction">
    <h1>Tecnología al alcance de todos.</h1>
    <form action="nosotros.html">
    <input class="introduction-button" type="submit" 
    value="Conócenos" />
    </form>
</div>

这是我的 CSS:

.introduction {
    width: 100%;
    margin: 0 auto;
    margin-top: 0px;
    background-color: #102a42;
    background-image: linear-gradient(0deg, #102a42 0%, #171c31 
    100%);
    background-image: url(../images/geometry.png); /* Image size 1280 x 1024px*/
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    text-align: center;
}

谢谢!

Answer 1

您将 .introduction-button 上的 padding: 20px 更改为 padding: 2% 是什么？应该大致根据您的需要进行扩展。