EGL モバイル・ウィジェットの外観のカスタマイズ

レイアウト要件を満たすように、スタイル・シート内の各モバイル・ウィジェットの外観を再定義することができます。

このタスクについて

デフォルトの基底クラスを使用して、図 1図 2 に変更できます。
図 1. リスト項目内で左揃えされたモバイル・ボタン
リスト項目内で左揃えされたモバイル・ボタン
図 2. リスト項目内で右揃えされたモバイル・ボタン
リスト項目内で左揃えされたモバイル・ボタン

手順

  1. 表 1 を見ると、リスト項目のデフォルトの基底クラスは eglMblListItem で、ボタンのデフォルトの基底クラスは eglMblBtn です。
  2. RUI ハンドラーに関連付けられたスタイル・シートに、以下の CSS 規則を追加します。

    .eglMblListItem .eglMblBtn{ float: right; margin-right: .3em; }

  3. Visual Editor を最新表示します。

タスクの結果

リスト項目の内部にあるすべてのモバイル・ボタンが右側に表示され、リスト項目の外部にあるボタンは影響を受けないことが確認できます。

フィードバック