Twitter Bootstrap工具提示不適用於CSS中的前綴

Question

我只想在某些特定容器中使用Twitter的引導程序樣式。 所以我像下面這樣給css加上前綴。

所有引導程序類都以“ .widget”為前綴（例如，“。widget article”等）

現在，引導程序的工具提示不再起作用。

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

我懷疑Twitter的javascript需要一些我可能已經覆蓋的類。

有什么提示嗎？

Answer 1

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

您可以使用：

更少的命名空間將所有Bootstrap的代碼包裝在您的“ .widget”中。 另請參閱： 如何為Twitter Bootstrap命名空間，以使樣式不沖突 ：

減：

.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自定義多個主題