Question

我有这个导航栏的代码完全可以正常工作，但是当我尝试用图像替换文本时，图像不会显示。

这是代码：

<a href="#" class="dropdown-toggle" data-toggle="dropdown"><img src="DAR.png" class="img-responsive"><b class="caret"></b></a>
                                <ul class="dropdown-menu">
                                    <li><a href="#">Sign-in</a></li>
                                    <li><a href="#">Sign-up</a></li>
                                </ul>

Answer 1

我认为您尝试将图像添加到导航栏。如果是这样，您需要在导航中添加带有css的图像。删除你的img链接。你可以这样做：

<a href="#" class="dropdown-toggle" id="nav"data-toggle="dropdown"><b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="#">Sign-in</a></li>
                                <li><a href="#">Sign-up</a></li>
                            </ul>

在你的CSS中添加：

#nav {
background-image:url('DAR.png');
}

Answer 2

您可以在链接中添加图片。看看这个fiddle。并确保图像的路径是正确的。如果路径是正确的，它应该工作。我改变了你的形象，现在正在工作。

<a href="#" class="dropdown-toggle" data-toggle="dropdown"><img src="https://s13.postimg.org/pzvk4df07/1475139047_three_bars.png" class="img-responsive"><b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="#">Sign-in</a></li>
                                <li><a href="#">Sign-up</a></li>
                            </ul>

如何使用bootstrap添加图像？

2 个答案: