Twitter Bootstrap - 如何在工具提示彈出框和元素之間添加更多餘量

我還沒有嘗試過任何東西，因爲我無法理解工具提示和元素之間的空間是從引導創建/添加的，通常tooltip確實接近元素觸發器工具提示事件。Twitter Bootstrap - 如何在工具提示彈出框和元素之間添加更多餘量

我只是想讓工具提示打開一點，遠離元素，從工具提示和eleemnt我的意思添加更多的餘量。

我想了解如何在CSS如果可能做到這一點，如果有可能，使得它的左，右，上，下提示

希望的問題是清楚的。

這是工具提示的樣子我的應用程序： enter image description here

，這是我想要做什麼和怎麼他們應該照顧 enter image description here

來源

2013-03-24 sbaaaang

我會後的圖像更清晰 – sbaaaang 2013-03-24 17:13:33

不使用默認選項時，您必須使用其他插件或改劇本代碼滿足您的需求。 – aNewStart847 2013-03-24 17:15:32

不錯，如果我需要一個解決方案我可以使用jquery，但我需要知道如何抓住tooltip並添加一些保證金更多 – sbaaaang 2013-03-24 17:16:45

這是在頂部的工具提示的默認CSS ：

：

.tooltip.top { 
    padding: 5px 0; 
    margin-top: -3px; 
}

您可以在自己的CSS覆蓋它

注意此代碼只會工作，工作在頂部的提示，你會NEDD適應CSS的3個其他方向：

.tooltip.top { margin-top: -10px; } 
.tooltip.right { margin-left: 10px; } 
.tooltip.bottom { margin-top: 10px; } 
.tooltip.left { margin-left: -10px; }

來源

2013-03-24 17:30:44 zessx

哦，這是真棒測試出來 – sbaaaang 2013-03-24 17:31:34

在bootstrap.css，你會發現這樣的代碼：

.tooltip.top { 
    padding: 5px 0; 
    margin-top: -3px; 
} 

.tooltip.right { 
    padding: 0 5px; 
    margin-left: 3px; 
} 

.tooltip.bottom { 
    padding: 5px 0; 
    margin-top: 3px; 
} 

.tooltip.left { 
    padding: 0 5px; 
    margin-left: -3px; 
}

更改或覆蓋邊距以更改從懸停元素提示工具提示的距離。

I.E.要設置提示的頂部位置更大的距離，設置.tooltip.top類是這樣的：

.tooltip.top { 
    padding: 5px 0; 
    margin-top: -70px; 
}

來源

2013-03-24 17:32:19

rly謝謝，我接受了其他答案只是因爲他是更快回復我:) – sbaaaang 2013-03-24 17:38:10

沒問題，這是公平的;） – 2013-03-24 17:41:47

如果我想要我的.tooltip.top只爲特定的div類 – Maulik 2017-03-23 06:19:43

Twitter Bootstrap - 如何在工具提示彈出框和元素之間添加更多餘量

回答

相關問題