從引導工具提示中移除透明度

來自twitter引導程序的標準.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);

但它似乎簡化版，工作...

來源

2016-01-29 ganjan

@ A.Wolff這是我在Chrome –

我在Firefox也。 – ketan

@ A.沃爾夫這是一個非常輕微的透明度。如果你仔細看，你會看到它 – NiallMitch14

在css..By添加.tooltip.in{opacity:1!important;}默認情況下它是0.9這爲什麼背景是透明的 jsfiddle

來源

2016-01-29 11:40:09 Dhara

添加到您的.tooltip類也不透明1，但標誌important。查看更新Fiddle

而在您的小提琴中，您直接在html中連接bootstrap.min.css。因此，在你的網站，你可以寫

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

沒有任何!important，它會工作。但在撥弄這是行不通的，因爲你沒有爲CSS使用External Resources

它因爲在你bootstrap.css你有

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

來源

2016-01-29 11:39:08

@RoryMcCrossen哦，對不起）我會更新答案。 –

你應該使用更具體的規則，而不是使用'！重要的陳述 –

當然你可以用父元素選擇符而不是！重要 – ShaneQful

加入這個類：

.tooltip.in { 
    opacity: 1 !important; 
}

來源

2016-01-29 11:40:44

你會需要具體的確切呼叫中的一個元素

.tooltip.in{ 
opacity: 0.9; 
}

在boostrap.min.css兩類

所以只要用1不透明覆蓋;

希望這會有所幫助，如果不是，您將需要！重要或前面的其他父元素 - 但無法在頁面上看到您的加載順序，因此無法確定優先級。

來源

2016-01-29 11:41:28

雅，'body .tooltip.in { opacity：1; }'修復它 –

請使用！重要的不透明度喜歡 -

.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; } 

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

來源

2016-01-29 13:29:05

從引導工具提示中移除透明度

回答

相關問題