gpt4 book ai didi

bootstrap-4 - 在移动 View 上更改 Logo - Bootstrap 4

转载 作者:行者123 更新时间:2023-12-04 15:27:19 25 4
gpt4 key购买 nike

我在 bootstrap 4 上有一个导航栏。当我在桌面 View 中时,我显示 Logo “x”,但是当我更改为移动 View 时,我需要将 Logo “x”更改为 Logo “y”。我尝试了下一个“解决方案”,但它不起作用。

<a class="navbar-brand hidden-sm-down">
<img src="./assets/img/genesyst-logo.png">
</a>
<a class="navbar-brand hidden-md-up">
<img src="./assets/img/genesyst-logo-wh.png">
</a>

你能帮帮我吗?

最佳答案

使用 Bootstrap 4 .hidden-* 类被移除,但您可以使用 display property 来实现相同的目标。

使用显示属性的解决方案:

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">

<a class="navbar-brand">
<!-- logo for large screen -->
<img class="d-none d-md-block" src="https://via.placeholder.com/400x90?text=big+logo" />

<!-- logo for small screen -->
<img class="d-md-none" src="https://via.placeholder.com/200x90?text=small+logo" />
</a>

有用的链接:

关于bootstrap-4 - 在移动 View 上更改 Logo - Bootstrap 4,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61993283/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com