Question

在我的html文件中，我试图将鼠标悬停在图标上时向其添加提示。但是我看到白色背景或边框以及工具提示。它在jsfiddle中显示为一个简单的工具提示，但是我可以看到它与背景一起使用了更多样式。我要删除图片中的白色背景。

http://jsfiddle.net/azsLk03y/3/`

<div class="container ">
</div>
<div class="row  margins ">
    <a href="#" class="">
        <span  class="glyphicon glyphicon-edit" data-toggle="tooltip" data-placement="top" title="Edit" ></span>
    </a>
    <a href="#" class="">
        <span  class="glyphicon glyphicon-search"data-toggle="tooltip" data-placement="top" title="Preview" ></span>
    </a>
    <a href="#" class="">
        <span  class="glyphicon glyphicon-envelope" data-toggle="tooltip" data-placement="top" title="Email"></span>
    </a>
    <a href="#" class="">
        <span  class="glyphicon glyphicon-trash" data-toggle="tooltip" data-placement="top" title="Delete" ></span>
    </a>
</div>
</div>

Thats how I see it in website

Answer 1

如果使用引导程序，则与工具提示类有一些冲突。这不是Bootstrap的默认工具提示。

在生成的CSS代码中进行搜索。

<a href="#" data-toggle="tooltip" title="Default tooltip">you probably</a>

Bootstrap Tooltip Example

Answer 2

将此添加到您的.css文件中

.tooltip-inner{
  background-color:#000;
}

Bootstrap工具提示具有白色背景

2 个答案: