2012-11-26 66 views
1

我只想在某些特定的容器中使用Twitter的引導樣式。所以我以如下的前綴作爲前綴。Twitter引導工具提示不能在CSS中使用前綴

所有自舉類得到了「.widget」前綴(如「.widget文章」等等)

現在引導的提示不工作了前綴。

<a href="#" data-placement="top" rel="tooltip" href="#" data-original-title="Facebook">Facebook</a> 

我懷疑Twitter的JavaScript要求某些類可能會被覆蓋。

任何提示?

+0

需要更多信息。你能提供更多的標記,至少是具有類「小部件」類的上下文嗎?另外,'fade','in'和'tooltip'類的CSS可能會很有用。 – merv

回答

0

因爲這是一個老問題,我將使用Twitter的Bootstrap v3。

您可以使用:

LESS命名空間來包裝所有的引導代碼在你的「.widget」。參見:How to namespace Twitter Bootstrap so styles don't conflict

減:

.widget 
{ 
@import "bootstrap.less"; 
} 

現在你將有一個包裹類.widget裏面的提示。 javascript插件使用類,但它們的功能將在包裝後相同。元素仍然具有類X.另一方面,這不會阻止JavaScript在包裝器外調用具有相同類名稱的元素。

HTML:

<div class="widget"> 
<button title="" data-placement="right" data-toggle="tooltip" class="btn btn-warning" type="button" data-original-title="Tooltip on right">Tooltip on right</button> 
</div> 

的javascript:

$('.widget button').tooltip(); 

參見:Twitter bootstrap 3 custom multiple theme's