スタイルエディタの「背景」パネルを使用すると、JavaServer Faces (JSF) コンポーネントの背景に対する CSS (Cascading Style Sheet) 規則を設定できます。背景とは、「出力テキスト」コンポーネントで黒い文字を見やすくするための白の背景など、コンポーネントの内容が表示される面を指します。「Style」プロパティーに追加した宣言は、そのページの CSS ファイルで定義されているその宣言に対応するルールに優先します。
「背景」パネルで設定できるスタイル宣言は次のとおりです。
background-color を設定します。具体的には次のことが可能です。
rgb(赤の値,緑の値,青の値) の形式で指定します。たとえば、白の値は rgb(255,255,255) となります。次の表に標準色を挙げます。
| 色の名前と RGB 値 | |||
|---|---|---|---|
| Black = "#000000" | Green = "#008000" | ||
| Silver = "#C0C0C0" | Lime = "#00FF00" | ||
| Gray = "#808080" | Olive = "#808000" | ||
| White = "#FFFFFF" | Yellow = "#FFFF00" | ||
| Maroon = "#800000" | Navy = "#000080" | ||
| Red = "#FF0000" | Blue = "#0000FF" | ||
| Purple = "#800080" | Teal = "#008080" | ||
| Fuchsia = "#FF00FF" | Aqua = "#00FFFF" | ||
background-image を設定します。このプロパティーは、コンポーネントの背景として使用される画像を指定します。画像は、Web サイトの画像への URL を入力することも、省略符号ボタン (...) をクリックして画像ファイルを選択して指定することもできます。画像ファイルを選択して指定した場合は、画像ファイルがプロジェクトの「リソース」ディレクトリに自動的に追加され、その参照が /resources/image-file となります。background-repeat を指定します。このプロパティーは、背景に使用する画像を 1 つだけ表示するのか、次のようなさまざまなパターンで複数表示するのかを指定します。
background-attachment を設定します。このプロパティーは、以降に説明するように背景の画像を固定して表示するか、移動させられるようにするかを指定します。
background-position の横方向コンポーネントを設定します。このプロパティーは、画像の初期位置を指定するために使用できます。位置の値は、ドロップダウンリストから「left」(左)、「center」(中央)、または「right」(右) を選択する、20 ピクセルのように絶対位置を指定する、または 20% のように相対位置を指定する、のいずれかの方法で指定できます。数値を指定した場合は、コンポーネントの左側からの位置となります。 background-position の縦方向コンポーネントを設定します。このプロパティーは、画像の初期位置を指定するために使用できます。位置の値は、ドロップダウンリストから「top」(上)、「center」(中央)、または「bottom」(下) を選択する、20 ピクセルのように絶対位置を指定する、または 20% のように相対位置を指定する、のいずれかの方法で指定できます。数値を指定した場合は、コンポーネントの最上部からの位置となります。