## スタイルを使った作業

Freewayではテキストの書式を複合的に組み合わせ、例えば「見出し」のようにわかりやすい名前をつけて管理できます。このようにまとまった書式の設定をスタイルといい、定義したスタイルは[スタイルとカラー]パレットから選択して、任意に選択したテキストに自由に適用できます。

スタイルの機能を利用すれば、あらかじめ多様な設定を1つのまとまりにしておけますので、定義したスタイルを適用するという1つの操作でWeb全体を通じて統一感のある外観を簡単に実現できます。さらにサイトのデザインを将来変更するにしても、定義されているスタイルを編集するだけで、自動的にそのスタイルが適用されている部分のテキストにはその変更が反映されます。

#### 属性

スタイルはフォントやサイズ、行揃えなど一連の属性から成ります。属性はCSS属性と画像属性に分かれ、さらにそれぞれを文字属性と段落属性に分けることができます。

#### CSS属性と画像属性

CSS属性はHTMLアイテムのテキストに適用できる属性です。画像属性は画像アイテムのテキストおよびHTMLアイテムのGIFテキストに適用できる属性です。

各スタイルの属性を確認するには、[スタイルを編集]ダイアログボックスの[表示]ポップアップメニューを使います。[CSS属性]、[画像属性]、[CSSと画像の属性]から表示したい属性を選択します。

例えばフォントのように、属性の中にはCSSテキストの場合と画像テキストの場合でオプションが異なることがあります。[スタイルを編集]ダイアログボックスでは、それぞれの場合の属性を個別に設定できるように両方のコントロールが表示されます。

#### 文字および段落の属性

[スタイルを編集]ダイアログボックスでは、属性リストは[文字]と[段落]のセクションに大きく分かれています。

文字属性は個々の文字または複数の文字から成る選択範囲に適用できます。

段落属性は段落全体およびその段落の文字すべてに適用できます。

さらに、[表示]を[画像属性]または[CSSと画像の属性]に切り替えると[画像テキストエフェクト]セクションが表示されます。ここで設定するテキストエフェクト属性は画像テキスト内の文字に適用できます。

### 新規スタイルを定義するには

- [スタイルとカラー]パレット上部の[スタイル]アイコンをクリックして、書類のスタイルを表示します。
- [スタイルとカラー]パレット上部右端の[スタイルオプション]アイコンをクリックして、表示されるポップアップメニューから[新規スタイル...]を選択します。

[スタイルを追加]ダイアログボックスが開きます。

- [名前]ボックスに新規スタイルの名前を入力します。
- このスタイルが適用されるテキストに挿入するHTMLタグを指定する場合は、[タグ]フィールドにタグを入力します。

[タグ]ポップアップメニューから既存のタグを選択することもできます。

例えば、標準のHTML見出しタグを使用する場合、[タグ]ボックスにh1、h2、またはh3とタグを入力します。これらタグを指定すれば、閲覧者のブラウザがCSSスタイルに対応していない古いタイプであっても、テキストは適当な見出し用のサイズと太さで表示されます。

- スタイルの文字属性を定義するには、[文字]セクションの右側の[＋]をクリックし、表示されるポップアップメニューから設定したい文字属性を選択します。

選択した属性のコントロールが[文字]セクションに追加されますので、必要に応じて設定します。

- 必要なだけ上記操作を繰り返してスタイルの文字属性を設定します。

属性を削除するには、[文字]セクションの文字属性の右側に表示されている[−]をクリックします。

- スタイルの段落属性を定義するには、[段落]セクションの右側の[＋]をクリックし、表示されるポップアップメニューから設定したい段落属性を選択します。

選択した属性のコントロールが[段落]セクションに追加されますので、必要に応じて設定します。

作成したいスタイルの定義が一通り完了したら：

- [OK]ボタンをクリックしてスタイルを作成します。

新たに作成したスタイルは[スタイルとカラー]パレットの[書類のスタイル]パネルに表示されます。このときスタイルにいずれかの段落属性が定義されている場合、スタイル名の左側に段落シンボルが表示されます。

### 既存のテキストを基にスタイルを定義するには

Freewayのメニューコマンドや[インスペクタ]パレットのオプションでテキストの書式を既に整えてある場合は、その書式を基にしてスタイルを作成できます。

Freewayでは、サイトで新たな書式の組み合わせが発生するたびに「.style1」や「.style2」のような名前で一時的なスタイルが自動的に作成されます。これら一時スタイルは、[スタイルとカラー]パレットの[スタイルパネル]において、常時設定スタイルの下に表示されます。

- 一時スタイルの定義を編集するには、controlキーを押しながら一時スタイル名をクリックし、コンテキストメニューから[スタイルを編集...]を選択します。

[スタイルを編集]ダイアログボックスが開きます。

- [名前]フィールドにスタイル名を入力し、このスタイルを常時設定にしたい場合は[常時設定]チェックボックスをチェックします。
- 上記の新規スタイルでの手順でスタイルの定義を行います。

### テキストにスタイルを適用するには

- スタイルを適用したいテキストを選択し、[スタイルとカラー]パレットの[書類のスタイル]パネルからスタイル名をクリックします。

コンテンツ