Html Bootstrap 4 navbar品牌-是否可以在较小的断点处使用不同的徽标？

我有以下标题徽标，在中等和较大尺寸时看起来不错，但不适用于较小屏幕：

我不能使用响应图像，因为假设我阅读正确，Bootstrap只是缩小宽度，同时保持高度不变。我担心文本将无法阅读，因为图像的宽度越来越窄

---

理想情况下，我会在中间断点处用一个较小的标志替换这个标志。这是可能的吗？

也许不是最优雅的，但快速简单：有两个品牌图像，使用引导实用程序显示类进行隐藏和显示

例如（我假设您使用的是.navbar品牌，但不管怎样，同样的技术也适用）：

---

这将显示尺寸为xs、sm和md的小徽标，以及尺寸为lg和xl的大徽标。

您不需要

xl

声明

d-lg-none

（及以上）是隐式的。是的，两个链接也毫无意义。只需两个

img

声明，所以一次也不需要两个链接。感谢这些提示，我显然是想走得太快：）

<a class="navbar-brand" href="#">
    <img src="logo-small.jpg" alt="Logo small" class="d-lg-none">
    <img src="logo-large.jpg" alt="Logo large" class="d-none d-lg-block">
</a>