天天看點

easyui-tabs第一個标簽被遮擋

使用easyui-tabs時布局的時候發覺第一個标簽的标題總是被遮擋,但是點選一下第二個标簽再點選一個标簽又恢複想要的效果了。例如:

easyui-tabs第一個标簽被遮擋

那麼解決方法就可以是,加載完成後讓它先選中第二個标簽,再選擇第一個标簽,但這會出現一個問題,就是頁面加載完成後會出現閃跳現象,即從第二标簽頁閃跳回第一标簽頁。找了很久,找到了另一個解決方法。

easyui-tabs預設情況下标簽是可以無限多的,是以他在.tabs樣式中設定了width:50000px;正因為這個寬度太長了,導緻很容易超出父類容器的邊界,而出現未知錯誤,那麼我們屏蔽掉該屬性。

easyui.css

easyui-tabs第一個标簽被遮擋

但是這也導緻了另一個問題,那就是标簽不可能再是無限多了,其tabs的長度就是父類的長度。魚與熊掌不可兼得,大家自我取舍吧。

easyui-tabs第一個标簽被遮擋

最後,我認為真正影響效果展示的可能是如下代碼:

ul, menu, dir {
  display: block;
  list-style-type: disc;
  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  -webkit-padding-start: 40px;
}
           

我是在谷歌浏覽器下進行的測試,是以很可能是谷歌的核心webkit的padding-start:40px導緻的。

繼續閱讀