Bootstrap之折疊和展開（Collapse）教程

發布日期：2018-03-20瀏覽次數：1638 來源：福州網站建設

折疊（Collapse）插件可以很容易地讓頁面區域折疊起來。無論您用它來創建折疊導航還是內容面板，它都允許很多內容選項。
如果您想要單獨引用該插件的功能，那么您需要引用 collapse.js，或者，正如 Bootstrap 插件概覽 一章中所提到，您可以引用 bootstrap.js 或壓縮版的 bootstrap.min.js。
一、用法
下表列出了折疊（Collapse）插件用于處理繁重的伸縮的 class：

您可以通過以下兩種方式使用折疊（Collapse）插件：

通過 data 屬性：向元素添加 data-toggle="collapse" 和 data-target，自動分配可折疊元素的控制。data-target 屬性接受一個 CSS 選擇器，并會對其應用折疊效果。請確保向可折疊元素添加 class .collapse。如果您希望它默認情況下是打開的，請添加額外的 class .in。
為了向可折疊控件添加類似折疊面板的分組管理，請添加 data 屬性 data-parent="#selector"。

通過 JavaScript：可通過 JavaScript 激活 collapse 方法，如下所示：
$('.collapse').collapse()

二、實例

通過點擊可以折疊內容。
//基本實例


1 2 3 4 5 6 7 8 9 10 11	`<button` `class="btn btn-primary"` `data-toggle="collapse"` `data-target="#content">` `Bootstrap` `</button>` `<div` `class="collapse"` `id="content">` `<div` `class="well">` `Bootstrap 是 Twitter 推出的一個用于前端開發的開源工具包。它由` 以上是由福州網站建設的小編為你分享了"Bootstrap之折疊和展開（Collapse）教程"文章，如果你在這方面有什么問題，隨時聯系我們上一篇：使用font-awesome小圖標下一篇：Bootstrap之折疊和展開（Collapse）教程返回欄目列表與php技術有關的文章 js文件中引用其他js文件 MYSQL ROUP BY 對多個字段進行分組詳解如何得到網站的真正ip php5.5以上ECSHOP如何解決Deprecated: preg_replace()報錯微信小程序怎么訪問微信小程序五種方法進入詳 php采集微信公眾號文章源代碼可用 2022 2023 微信開發中被動回復連續回復多條信息怎么實現 ecshop茶葉商城源碼模版的幾處BUG修改 git更新遠程倉庫代碼到本地 mysql on 和where條件的放置詳解 php curl請求亂碼問題 syntaxerror, unexpected $end in原因短標簽未開啟如果您有什么問題，歡迎咨詢我們客服！點擊QQ咨詢資訊中心福州網站建設 php技術站長新聞公司新聞聯系方式地址：福建省福州市海通廣場2號樓電話：18558752805 關于福州網站建設福州網站建設、福州網站設計、福州小程序制作，福州網站設計哪家公司最好、有哪些靠譜?福州網站建設通過對策略、創意和行業發展的深度洞察，幫助客戶鎖定目標用戶。我們以專業福州網站制作公司的視角，對客戶進行良性引導，幫客戶完成網站建設規劃，并提供網站架設、網站制作報價收費明細。我們為福州提供高端品牌網站建設制作,公司門戶網站開發,服務。福州企業網站搭建\福州網站制作要多少錢，請咨詢我們公司我們一定會給你一個優惠的報價以及做出你滿意的網站、小程序、系統！ Copyright ? 2017-2022 ?www.txwhj.cn福州網站制作福州小程序制作福州網站建設閩ICP備16037694號-2 福州網站建設_福州網站設計_福州微信公眾號開發_福州小程 QQ咨詢 QQ在線咨詢真誠為您提供專業解答服務售前技術售后技術咨詢熱線 18558752805 全天候技術服務熱線添加微信微信便捷交流返回頂部高清国产美女一级毛片_91短视频版在线观看www免费_久久久久久久综合_国产精品爱久久久久久久电影

高清国产美女一级毛片_91短视频版在线观看www免费_久久久久久久综合_国产精品爱久久久久久久电影

網站新聞

Bootstrap之折疊和展開（Collapse）教程

資訊中心

聯系方式

關于福州網站建設