<contentContainer>要素
ネームスペース: http://xmlns.oracle.com/uix/ui
ルック・アンド・フィール: Base Desktopのルック・アンド・フィール

contentContainerには、2つのリージョン(ボディ・リージョンとヘッダー・リージョン)が含まれます。ボディ・リージョンはcontentContainerのコンテンツを含み、ヘッダー・リージョンはcontentCotainerのヘッダーのテキストを含みます。 ボディ・リージョンには、OraContentContainerBodyスタイル・クラスを介してスタイルを適用できます。 同様に、ヘッダー・リージョンのスタイルは、OraContentContainerHeaderスタイル・クラスを介して指定します。

これら2つのリージョン自体は、外側のコンテナ内でレンダリングされます。このコンテナにもスタイルを適用できます。 外側のリージョンには、ヘッダーが存在するかどうかに応じて異なる2つのスタイル・クラス・セットが存在します。 ヘッダーが存在する場合、contentContainerの背景色に応じて次のいずれかのスタイル・クラスが使用されます。

ヘッダーが存在しない場合、外側のコンテナは次のスタイル・クラスを使用します。

特定の背景タイプのcontentContainerのボディまたはヘッダーにスタイルを適用するには、コンテキスト・セレクタを使用します。 たとえば、次のセレクタを使用して、dark contentContainerのヘッダー・リージョンとボディ・リージョンのプロパティを変更できます。


  <style selector=".OraContentContainerDark .OraContentContainerHeader">
    <!-- Style properties for dark contentContainer header -->
  </style>

  <style selector=".OraContentContainerDark .OraContentContainerBody">
    <!-- Style properties for dark contentContainer body -->
  </style>

        

また、次のセレクタを使用すると、ヘッダーを持たないdark contentContainerのボディ・リージョンのプロパティを変更できます。

  <style selector=".OraContentContainerContentDark .OraContentContainerBody">
    <!-- Style properties for dark headerless contentContainer body -->
  </style>
        

異なる背景タイプのcontentContainerに共通のスタイル・プロパティを簡単に適用できるように、複数の名前付きスタイルが公開されています。 たとえば、ContentContainerDarkBackground名前付きスタイルを使用すると、すべてのdark contentContainerの背景色を設定できます。 外側のコンテナがOraContentContainerDark(ヘッダーが存在する)またはOraContentContainerContentDark(ヘッダーが存在しない)のどちらのスタイル・クラスを使用するかにかかわらず、この名前付きスタイルが使用されます。 使用可能なすべての名前付きスタイルのリストは、次の名前付きスタイルの表を参照してください。

スタイル
名前付きスタイル 説明
ContentContainer OraContentContainerDark、OraContentContainerMedium、OraContentContainerLightおよびOraContentContainerTransparentスタイル・クラスで共有される共通のプロパティを指定します。
ContentContainerContent OraContentContainerContentDark、OraContentContainerContentMedium、OraContentContainerContentLightおよびOraContentContainerContentTransparentスタイル・クラスで共有される共通のプロパティを指定します。
ContentContainerBody

4つのタイプのOraContentContainer<Background>のボディ・リージョンで共有される共通のプロパティを指定します。 このスタイルは、次のセレクタによってインクルードされます。

  • .OraContentContainerDark .OraContentContainerBody
  • .OraContentContainerMedium .OraContentContainerBody
  • .OraContentContainerLight .OraContentContainerBody
  • .OraContentContainerTransparent .OraContentContainerBody
ContentContainerContentBody

4つのタイプのOraContentContainerContent<Background>のボディ・リージョンで共有される共通のプロパティを指定します。 このスタイルは、次のセレクタによってインクルードされます。

  • .OraContentContainerContentDark .OraContentContainerBody
  • .OraContentContainerContentMedium .OraContentContainerBody
  • .OraContentContainerContentLight .OraContentContainerBody
  • .OraContentContainerContentTransparent .OraContentContainerBody
ContentContainerDarkBackground

dark contentContainerの背景色を設定します。 このスタイルは、次のセレクタによってインクルードされます。

  • .OraContentContainerDark .OraContentContainerBody
  • .OraContentContainerContentDark .OraContentContainerBody
ContentContainerMediumBackground

medium contentContainerの背景色を設定します。 このスタイルは、次のセレクタによってインクルードされます。

  • .OraContentContainerMedium .OraContentContainerBody
  • .OraContentContainerContentMedium .OraContentContainerBody
ContentContainerLightBackground

light contentContainerの背景色を設定します。 このスタイルは、次のセレクタによってインクルードされます。

  • .OraContentContainerLight .OraContentContainerBody
  • .OraContentContainerContentLight .OraContentContainerBody
ContentContainerTransparentBackground

transparent contentContainerの背景色を設定します。 このスタイルは、次のセレクタによってインクルードされます。

  • .OraContentContainerTransparent .OraContentContainerBody
  • .OraContentContainerContentTransparent .OraContentContainerBody
スタイル・クラス 説明
OraContentContainerBody このスタイル・クラスは、contentContainerのボディ・リージョンに関連付けられます。
OraContentContainerHeader このスタイル・クラスは、contentContainerのヘッダー・リージョンに関連付けられます。
OraContentConatinerDark このスタイル・クラスは、dark contentContainerの外側のコンテナに関連付けられます。
OraContentConatinerMedium このスタイル・クラスは、medium contentContainerの外側のコンテナに関連付けられます。
OraContentConatinerLight このスタイル・クラスは、light contentContainerの外側のコンテナに関連付けられます。
OraContentConatinerTransparent このスタイル・クラスは、transparent contentContainerの外側のコンテナに関連付けられます。
OraContentConatinerContentDark このスタイル・クラスは、ヘッダーを持たないcontentContainer用に、OraContentContainerDarkスタイル・クラスのかわりに使用されます。
OraContentConatinerContentMedium このスタイル・クラスは、ヘッダーを持たないcontentContainer用に、OraContentContainerMediumスタイル・クラスのかわりに使用されます。
OraContentConatinerContentLight このスタイル・クラスは、ヘッダーを持たないcontentContainer用に、OraContentContainerLightスタイル・クラスのかわりに使用されます。
OraContentConatinerContentTransparent このスタイル・クラスは、ヘッダーを持たないcontentContainer用に、OraContentContainerTransparentスタイル・クラスのかわりに使用されます。