gwt - gwtでタブバーのタブを制御する

Question

愚かな質問でごめんなさい私は一般的にUIと特にgwtに不慣れです

1. gwtでタブパネルを使用するときにタブ幅を制御するにはどうすればよいですか？どうやって
2. 各ウィジェットが持つcss属性をどのように知ることができますか？タブの色（選択されているものと選択されていないもの）を制御し、タブフレームを削除したい

ありがとう

Answer 1

UI全般に慣れていない場合は、[Firebug]を知らないかもしれません。これは、ページ内のすべての要素を検査し、スタイルがどのように適用されているかを把握し、リアルタイムで変更することもできる Firefox プラグインです。これはGWT の開発に不可欠です。

それに加えて、各タブのスタイルを個別に制御するには、 を使用してタブにラベルを挿入し、スタイルを設定する必要があると思いますTabBar.addTab(Widget widget)。

Answer 2

DecoratedTabBarのjavadocには、選択されたタブと選択されていないタブの両方に使用できるスタイル名がリストされています。

* .gwt-DecoratedTabBar { the tab bar itself }
* .gwt-DecoratedTabBar .gwt-TabBarFirst { the left edge of the bar }
* .gwt-DecoratedTabBar .gwt-TabBarRest { the right edge of the bar }
* .gwt-DecoratedTabBar .gwt-TabBarItem { unselected tabs }
* .gwt-DecoratedTabBar .gwt-TabBarItem-wrapper { table cell around tab }
* .gwt-DecoratedTabBar .gwt-TabBarItem-selected { additional style for selected tabs }
* .gwt-DecoratedTabBar .gwt-TabBarItem-wrapper-selected { table cell around selected tab }
* .gwt-DecoratedTabBar .tabTopLeft { top left corner of the tab}
* .gwt-DecoratedTabBar .tabTopLeftInner { the inner element of the cell}
* .gwt-DecoratedTabBar .tabTopCenter { top center of the tab}
* .gwt-DecoratedTabBar .tabTopCenterInner { the inner element of the cell}
* .gwt-DecoratedTabBar .tabTopRight { top right corner of the tab}
* .gwt-DecoratedTabBar .tabTopRightInner { the inner element of the cell}
* .gwt-DecoratedTabBar .tabMiddleLeft { left side of the tab }
* .gwt-DecoratedTabBar .tabMiddleLeftInner { the inner element of the cell}
* .gwt-DecoratedTabBar .tabMiddleCenter { center of the tab, where the tab text or widget resides }
* .gwt-DecoratedTabBar .tabMiddleCenterInner { the inner element of the cell}
* .gwt-DecoratedTabBar .tabMiddleRight { right side of the tab }
* .gwt-DecoratedTabBar .tabMiddleRightInner { the inner element of the cell}