スタイルの設定方法

ホームページの作り方
スタイルの設定
スタイルの設定とは、文字のフォント、大きさ、色、行間高さ、装飾などを設定することです。
設定する範囲は、ページ全体の設定、表のセル一つ分の設定、個々の文字のなど、方法は広範囲に及びます。
もちろん、設定はしない場合は、初期値での設定がされています。設定をしないで初期値のままの表示であれ
ば非常に見づらくなります。その箇所の特色に応じて細かく設定するのがベターです。(非常に繁雑な作業で
すが、ページの見やすさ、親しみやすさなどを考えれば細かく設定した方が説得力があります。
A.ページ全体の設定
1.左上の隅にカーソルを持っていきクリックしてブリンクさせる
2.その位置で右クリックしてポップアップメニューを表示させる。
3.上図のスタイルの設定をクリックすると次の窓が開く
ここをクリック
4.上図の「BODY」横の編集をクリックすると次の窓が開く
1
ホームページの作り方
フォントを選択
文字の属性を選択
5.フォントを選択してアクティブにし、追加で確定させる。
6.文字の属性(太さ、斜体、変形、変換)の選択する。
7.文字のサイズを決める。単位は「ポイント」にし、任意の大きさを選択。通常の文章であれば、
「12」くらいが適当ではないかと考えられる。
8.下線、上線、取消線、点滅などの文字装飾を選択する。
9.次にインデックスの「色と背景」をクリックして、文字色と文字の背景色を選択する。
2
ホームページの作り方
ここで壁紙の設定も可。
10.現在の設定は、ページ全体の設定であるので、色は標準(黒)
、背景は標準(白)で、この場合は、
何も設定しなくてもOK。仮に何らかの背景色を選択すると、もともと設定されていた壁紙に上書き
されてしまい壁紙は消えてしまう。さらに、壁紙は、ここで設定することも出来る。
属性は、壁紙の貼り込み方を指定するもので、スクロールを選択すると文字や写真などにひっついて
壁紙も動きます。固定の場合は、壁紙は固定されて文字や写真などと一緒に動きません。
**繰り返しということに関しては、触れませんが初期値では「繰り返し」になっています。
12.次に文字のレイアウトを設定します。「文字のレイアウト」インデックスをクリックすると次の窓が
開きます。
行間を設定します。
13.文字のレイアウトでは、初期値では、あまりにも行間がなく、非常に読みづらくなっています。通常、
3
ホームページの作り方
正木が作る場合は、行間を設定します。単位を「㎜」として、値を「6か7」にしています。この辺
は、あくまで作る人の感覚ですから任意です。文字間は初期値でも問題ないと思います。
14.以上で主だった最低必要限度のスタイル設定は、終わりです。もっと細かい設定が出来るはずですが、
正木自身今まで触ったことがありませんので、皆さんで試行錯誤しながら触ってみて下さい。
B.表のセル一つ分のスタイル設定
1.表の文字スタイルを設定するセルにポインタを持っていきクリックしてブリンクさせる。
2.Aの作業と同じく右クリックしてポップアップメニューを表示させて「スタイル設定」をクリックす
ると次のAと同じ窓が開く。
個々のセルの設定の場合は、
ここをクリックする。
3.ここからは、すべてAの作業と同じです。もちろん、そのセルだけに設定する壁紙も設定出来ます。
以下、スタイル設定の初期値とスタイル設定後の違いの図を表示します。
4
ホームページの作り方
この場合写真の大きさとマッチしていないので、写真の上下に空白が出来ました。そんな場合は、フォン
トの大きさや行間高さを調整して写真の大きさに合わすのがベターだと思います。
C.個々の文字のスタイル設定
AとBで設定したものを、さらに個々の文字についても文字のスタイル設定が出来ます。
1.設定したい文字をドラックしてアクティブにします。
2.この状態でメニューバーの「書式」クリックすると下のポップアップメニューが開きます。
5
ホームページの作り方
3.ここで設定したメニューをクリックします。ここでは、フォントを選択すると次の窓が開きます。
4.上図で色、サイズ、フォントなどを設定出来ます。文字飾りの太字は、もともとセルの設定で太字と
なっているので設定の必要はありません。セルの設定がふつうの太さの場合、ここで太字の設定が出
来ます。逆に太字になっているをふつうに戻したいのであれば、セルの設定で変更する必要がありま
す。
5.上記で設定した場合は、下図のような画面になります。
6
ホームページの作り方
大雑把なスタイル設定については以上です。もっともっと細かい設定も可能ですので、それは皆さんで試
行錯誤をしながらトライしてみて下さい。ただし、以上のことをクリア出来れば、普通のホームページと
しては、何ら問題なく見ることが出来ると思います。
説明につきましては、皆さんがお持ちのホームページビルダーのバージョンが異なりますので、汎用性を
考えてメニューバーからの説明になりましたが、ツールバー上にあるアイコンを使えばもっと簡単にコマ
ンドを実行出来ると思いますので、その点ご了解下さい。
以上
7