从引导工具提示中删除透明度

Question

来自twitter bootstrap的标准.tooltip具有我想删除的透明度.

这是我的HTML:

<a href="#" class="btn
btn-info" 
style="margin:10px;" 
data-toggle="tooltip" 
data-placement="bottom" 
data-html="true"
title="MERKNAD 1 Denne klassifiseringen er i henhold til NS-EN 13501-2. <br /><br /> MERKNAD 2 Valgene 11-16 gjelder bærende konstruksjoner, valgene 21-24 gjelder kun integritet, valgene 31-37 gjelder både integritet og isolasjon, valgene 41-46 gjelder bærende skiller konstruksjoner med isolasjonskrav, og valgene 51-54 gjelder seksjoneringsvegger og dekker.">Hover</a>

CSS:

.tooltip > .tooltip-inner {
    border: 1px solid;
    padding: 10px;
    max-width: 450px;
    color: black;
    text-align: left;
    background-color: white;
    background: white;
    opacity: 1.0;
    filter: alpha(opacity=100);
}
.tooltip > .tooltip-arrow {
    border-bottom-color: black;
}

我也在这里做了一个JSFiddle来说明:https://jsfiddle.net/fiddlejan/xpwhknja/

如果将鼠标悬停在按钮上,则可以看到透明工具提示文本如何显示下方的文本.

我试过了:

opacity: 1.0;
filter: alpha(opacity=100);

但它似乎没有工作......

Answer 1

添加.tooltip.in{opacity:1!important;}css ..默认情况下,这就是0.9为什么背景是透明的 jsfiddle

Answer 2

添加到您的.tooltip班级也是不透明度1,但带有标志important.查看更新的小提琴

在你的小提琴中你bootstrap.min.css直接用html 连接.所以在你的网站上你可以写

.tooltip.in {
  opacity: 1;
  filter:alpha(opacity=100);
}

没有任何!important它会工作.但是在小提琴中它不起作用,因为你没有使用那个CSSExternal Resources

因为在你的bootstrap.css中你有

.tooltip.in{filter:alpha(opacity=90);opacity:.9}

Answer 3

Bootstrap v4.0：

.tooltip.show {
    opacity: 1;
}