複数のWebページのスタイルおよびレイアウトを制御するには、Cascading Style Sheetを使用します。CSSスタイルを使用すると、HTMLタグの書式属性、クラス属性によって識別されるテキストの範囲、Cascading Style Sheet(CSS2)仕様に準拠した基準を満たすテキストなどを定義できます。CSSファイルに対して行われた変更は、コード・エディタ、構造ウィンドウ、およびプロパティ・インスペクタに統合されます。
JDeveloperは、次の操作を行うツールを提供します。
編集のためにCSSファイルを開くと、ファイル内のCSSセレクタが次の3タイプのいずれかとして「構造」ウィンドウに表示されます。
要素
CSSセレクタで定義されたHTML要素またはタグ。プロパティと値は、コロンで区切って中カッコで囲みます。たとえば、body {color:black;}
となります。
クラス
同じタイプのHTML要素に対して定義された様々なスタイル。たとえば、p.right {text-align:right;}
は右揃えの段落テキスト、p.left {text-align:left;}
は左揃えの段落テキストを意味します。また、セレクタにタグ名を含めなければ、特定のクラスのHTML要素すべてで使用されるスタイルを定義できます。たとえば、.center {text-align:center;}
はclass="center"
が指定されたすべてのHTML要素が中央揃えになることを意味します。
ID
1つのHTML要素に固有のスタイル。たとえば、p#para1 {color:green;}
は id value="para1"
が指定されたp要素、*#ver905 {background-color:red;}
はid value="ver905"
が指定された最初のHTML要素を意味します。
構造ウィンドウ・ツールバーの「カテゴリ」ドロップダウン・リストを使用すると、CSSセレクタをカテゴリ別に表示できます。
カテゴリなし
CSSファイルでの出現順に表示します。デフォルト設定。
タイプ・カテゴリ
CSSセレクタのタイプ(要素、クラスまたはID)別に並べ替えます。
要素カテゴリ
HTML要素別またはタグ別に並べ替えます。
構造ウィンドウでCSSセレクタを選択すると、そのセレクタがCSSファイル内でハイライト表示され、関連するプロパティおよび値がプロパティ・インスペクタに表示されて編集可能になります。
「構造」ウィンドウでセレクタ・カテゴリを分離またはグループ化解除するには、「グループ化したセレクタの分離」 アイコンを選択します。
CSSファイル内で選択した要素をコメント・アウトするには、要素グループを選択し、右クリックして「コメント・アウト」を選択します。
CSSの詳細は、W3C Webページhttp://www.w3.org/TR/1998/REC-CSS2/を参照してください。
HTMLページの操作
Webページおよび設計ツールの操作
JSPページの操作
スクリプト言語の操作
Copyright © 1997, 2009, Oracle. All rights reserved.