默認(rèn)風(fēng)格的Tab
  • 網(wǎng)站設(shè)置
  • 用戶管理
  • 權(quán)限分配
  • 商品管理
  • 訂單管理
1. 高度默認(rèn)自適應(yīng)，也可以隨意固寬。
2. Tab進(jìn)行了響應(yīng)式處理，所以無需擔(dān)心數(shù)量多少。
內(nèi)容2
內(nèi)容3
內(nèi)容4
內(nèi)容5
動(dòng)態(tài)操作Tab
  • 網(wǎng)站設(shè)置
  • 用戶管理
  • 權(quán)限分配
  • 商品管理
  • 訂單管理
內(nèi)容1
內(nèi)容2
內(nèi)容3
內(nèi)容4
內(nèi)容5
Hash地址定位
  • 網(wǎng)站設(shè)置
  • 用戶管理
  • 權(quán)限分配
  • 商品管理
  • 訂單管理
點(diǎn)擊該Tab的任一標(biāo)題，觀察地址欄變化，再刷新頁面。選項(xiàng)卡將會(huì)自動(dòng)定位到上一次切換的項(xiàng)
內(nèi)容2
內(nèi)容3
內(nèi)容4
內(nèi)容5
簡潔風(fēng)格的Tab
  • 網(wǎng)站設(shè)置
  • 用戶管理
  • 權(quán)限分配
  • 商品管理
  • 訂單管理
內(nèi)容不一樣是要有，因?yàn)槟憧梢员O(jiān)聽tab事件（閱讀下文檔就是了）
內(nèi)容2
內(nèi)容3
內(nèi)容4
內(nèi)容5
卡片風(fēng)格的Tab
  • 網(wǎng)站設(shè)置
  • 用戶管理
  • 權(quán)限分配
  • 商品管理
  • 訂單管理
默認(rèn)寬度是相對(duì)于父元素100%適應(yīng)的，你也可以固定寬度。
2
3
4
5
6
當(dāng)Tab數(shù)超過一定寬度
  • 網(wǎng)站設(shè)置
  • 用戶管理
  • 權(quán)限分配
  • 商品管理
  • 訂單管理
1. 寬度足夠，就不會(huì)出現(xiàn)右上圖標(biāo)；寬度不夠，就會(huì)開啟展開功能。
2. 如果你的寬度是自適應(yīng)的，Tab會(huì)自動(dòng)判斷是否需要展開，并適用于所有風(fēng)格。
2
3
4
5
6
帶刪除功能的Tab
  • 網(wǎng)站設(shè)置
  • 用戶基本管理
  • 權(quán)限分配
  • 商品管理
  • 訂單管理
1. 我個(gè)人比較喜歡卡片風(fēng)格的，所以你發(fā)現(xiàn)又是以卡片的風(fēng)格舉例 2. 刪除功能適用于所有風(fēng)格
2
3
4
5
6
更多我們未能呈現(xiàn)的示例，還有待您在閱讀文檔、以及不斷使用的過程，去深入挖掘。