實現效果
html模板
任務名稱
任務狀態
下次匯報時間
是否逾期
逾期天數
測試任務
進行中2019-04-25否0
測試任務2
進行中2019-04-25否0
內容二內容三
內容四
var lis = document.queryselectorall(".tab-header li"); //查詢到所有的樣式為tab-header下的li(即tab頁籤)
for (var i=0; i主要的css
.tab-header
.tab-header ul,.tab-header-bold ul
.tab-header-bold ul
.tab-header ul li,.tab-header ul .ul-span,
.tab-header-bold ul li,.tab-header-bold ul .ul-span
.tab-header ul li:last-child,.tab-header ul span:last-child,
.tab-header-bold ul li:last-child,.tab-header-bold ul span:last-child
.tab-header ul li,.tab-header ul .ul-span
.tab-header-bold ul li,.tab-header-bold ul .ul-span
.tab-content
.tab-item
.tab-active
.tab-active-color
.tab-item-active
.not-allowed
.badge
.task-table
.task-table td
.task-table thead tr td
.task-table tbody tr td
.task-table tbody tr:nth-child(odd)
.task-table tbody tr:nth-child(even)
.task-table tbody tr:hover
內容一
內容二內容三
內容四任務名稱
任務狀態
下次匯報時間
是否逾期
逾期天數
測試任務
進行中2019-04-25否0
測試任務2
進行中2019-04-25否0
內容二內容三
內容四
自定義結構 Tab切換
前言 在搭建頁面的時候，可能會需要多塊區域進行tab切換，這時候需要規範化封裝乙個結構，只需要一段js,可重複且多處使用 1 tab樣式 3 html結構 hover box hover change active 公告 li 決定 li 會議 li ul hover content style d...
vconsole自定義日誌tab
vconsole自定義外掛程式,tutorial上都是繼承vconsoleplugin，但這個外掛程式是最基礎的，沒有log tab上的all log info warn 等按鈕，也沒有clear hide按鈕。翻了一下原始碼，除了vconsoleplugin，還有vconsolelogplugin...
tab切換效果
今天上一套tab切換效果的 就自己實現吧！下面貼html 大體分兩部分，div和按鈕div，很容易看懂 123 45這個還是比較簡單的div結構，下面是對應的css button btn p main pictures 對所有div的簡單布局，最後主要實現功能 所以重要的js 如下 window.o...