5

私はjqueryタブで遊んでいて、自分に合ったスタイルにしようとしています。height:45px;以下に示すように、タブを縮小して、UI スタイルシートに を 追加しようとしました。

.ui-tabs-vertical .ui-tabs-nav li { 
  clear: left; 
  height:45px; 
  width: 100%; 
  border-bottom-width: 1px !important; 
  border-right-width: 0 !important;
  margin: 0 -1px .2em 0;
}

それでも、すべてのタブを縮小する代わりに、1 つ (最後のタブ) を変更しませんでした。これは、 Trash JS-FIDDLE demoというラベルの付いたタブで確認できます。何が起こっているのか、どうすれば修正できるのかを理解したいと思います。また、他のコーディングのヒントも大歓迎です。

4

3 に答える 3

4

内のアンカー タグliは よりも高くなっていliます。その高さを制限すれば、機能します。

    .ui-tabs-vertical .ui-tabs-nav li a { height: 30px; }

更新されたフィドルを参照してください

Chrome 開発者ツールで、タブが重なっていることに気付きました。最後の 1 つだけが重なっていないため、他のものより高く見えます。

于 2012-12-19T07:44:08.020 に答える
1

最初にウィジェットのフォントサイズを縮小します

.ui-widget{font-family:Arial,sans-serif;font-size:medium}
于 2012-12-19T07:41:35.400 に答える
0

この高さで遊ぶと、問題が解決します。

.accordion li > a {height:30px !important; }

于 2012-12-19T07:48:47.387 に答える