☰

Bootstrap 4：如何在不使用 CSS 的情况下添加背景图像

tag-icon • tag-icon css
Bootstrap 4：如何在不使用 CSS 的情况下添加背景图像

Bootstrap 定义了 CSS 类来涵盖最常见的网站设计元素，但我不知道如何使用 Bootstrap 类指定背景图像文件，而无需添加笨重的自定义 CSS。

答案1

您必须使用 style 提供 background-image:url(''); 属性来提供图像的路径，然后可以使用 .bg-image 类使图像具有响应性。
您可以这样做：
通过内联 CSS 添加 background-image。
添加 .bg-image 类以正确缩放图像并启用响应性。
示例：

<div class="bg-image" 
     style="background-image: url('https://i.postimg.cc/ZnHTP71s/aircraft-airplane-boat-1575833.jpg');
            height: 100vh">
</div>

vh 代表视口高度。
这里的 height:100vh 表示可用高度的 100%。

相关内容