コンテナのスタイル設定
アドバンスレスポンシブマッシュアップには、スタイルを適用できるコンテナが含まれています。マッシュアップスタイルテーマを介してスタイルを適用するか、「スタイルプロパティ」パネルで直接適用できます。デフォルトでは、マッシュアップスタイルテーマを使用してコンテナにスタイルが設定されますが、スタイル定義を使用することもできます。UseTheme「プロパティ」パネルの プロパティによって、コンテナのテーマモードが制御されます。
コンテナのスタイルテーマプロパティを表示するには、次の操作を実行します。
1. 「エクスプローラ」パネルで、コンテナを選択します。
◦ または、コンテナ内の空の領域をクリックします。
2. 「スタイルプロパティ」パネルをクリックします。
3. 「ベース」状態を展開します。flexcontainer エレメントの下にスタイルプロパティがリストされます。
スタイルテーマによるスタイル設定からスタイル定義に切り替えることができます。スタイル定義を使用するには、次の操作を実行します。
1. コンテナを選択します。
2. 「プロパティ」パネルで、UseTheme チェックボックスをオフにします。
3. 「スタイルプロパティ」パネルをクリックします。
コンテナのスタイル定義が、スタイルプロパティの代わりに表示されます。
スタイルプロパティ
次のスタイルプロパティを指定できます。
|
プロパティ
|
説明
|
|---|---|
|
background
|
コンテナの背景色。
|
|
border-color
|
境界線の色。
|
|
border-radius
|
境界の隅の半径。このプロパティは、コンテナの 4 つの隅すべてに適用されます。
|
|
border-style
|
境界線のスタイル。Dotted、Dashed、Solid、Double、Groove、Ridge、Inset、Outset、Inherit、または None に設定できます。
|
|
border-width
|
境界線の幅。
|
コンテナスタイルプロパティのカスタマイズ
次の表に、flexcontainer エレメントのスタイルプロパティ値を、スタイル設定されたコンテナのカスタム値と比較して示します。
|
スタイル/プロパティ
|
デフォルト
|
スタイル設定
|
|---|---|---|
|
プロパティ
|
• background - #ffffff
• border-color - inherit
• border-radius - None
• border-style - None
• border-width - None
|
• background - #cccccc
• border-color - #AAE09F
• border-radius - 4px
• border-style - Solid
• border-width - 4px
|
|
プレビュー
|
 |
 |
 |
デフォルトのスタイルプロパティ値は、マッシュアップスタイルテーマから取得されます。
|