Twitter Bootstrap html標籤如何工作？

在下面的示例中（取自here），單個標籤出現在幕後會發生什麼？例如，它們在頁面加載時是否完全不呈現，並且僅在選擇該選項卡時才作爲DOM對象創建/初始化？或者它們全部是從頁面加載渲染的，但隱藏或隱藏直到選中？Twitter Bootstrap html標籤如何工作？

<ul class="nav nav-tabs"> 
    <li><a href="#home" data-toggle="tab">Home</a></li> 
    <li><a href="#profile" data-toggle="tab">Profile</a></li> 
    <li><a href="#messages" data-toggle="tab">Messages</a></li> 
    <li><a href="#settings" data-toggle="tab">Settings</a></li> 
</ul> 

<div class="tab-content"> 
    <div class="tab-pane active" id="home">...</div> 
    <div class="tab-pane" id="profile">...</div> 
    <div class="tab-pane" id="messages">...</div> 
    <div class="tab-pane" id="settings">...</div> 
</div>

謝謝！

來源

2013-05-07 exxodus7

這些標籤特定於您在鏈接中提到的Bootstrap庫。在該庫之外沒有什麼特別的事情發生（使用JavaScript來實現標籤）。 – 2013-05-07 02:01:51

這些是Bootstrap選項卡。它們全部在頁面加載時呈現並可見。渲染後，如果您從Bootstrap（bootstrap-tab.js）中包含正確的JavaScript文件，則會附加一些事件。然後，這些事件處理在單擊標籤時發生的情況，在引導CSS文件中設置默認樣式:active和:hover狀態。你可以找到如何實現它的例子 - 以及當點擊標籤時如何添加你自己的功能的例子 - 你在問題中提供的鏈接。

來源

2013-05-07 02:10:21

Twitter Bootstrap html標籤如何工作？

回答

相關問題