ホームページビルダー 初級講座   Room110   第5回 

文字の大きさ、色 背景色を変えて見栄えを良くする
  
 第4回で作ったファイルを呼び出し、文字の大きさ、色を変えて見栄えを良くします。
 今日は感性の世界になりますので、サンプルがいいのではありません。自他ともに納得すればいいのです。
1. 第4回 保存した lesson4.html を呼び出してください。

これでしたね?
文章を入れる アイコン
どんどん入力してください。別のサイトからコピーした文章、ワープロなどで既に作た文章を、範囲指定してコーピーしていいのです。
改行はEnterキーで、ワープロと同じです。
この枠が、一枚の用紙というイメージです。ただし、縦横伸び縮みする用紙です。

2.わかりやすくするために、枠を表示させましょう。要領は第4回にあります。忘れた方は
  4回にバックして、おさらいをしましょう
 
文章を入れる アイコン
どんどん入力してください。別のサイトからコピーした文章、ワープロなどで既に作た文章を、範囲指定してコーピーしていいのです。
改行はEnterキーで、ワープロと同じです。
この枠が、一枚の用紙というイメージです。ただし、縦横伸び縮みする用紙です。

3.上段のタイトルが左づめになっています。これを中央(センタリング)に配置します。
 枠内をクリックして、アイコンバーの中からセンタリングをクリックします。
枠それぞれに同じことをしてもいいのですが、 2つの領域をドラッグすると
下の図のように、黒に反転するので、その後にセンタリングアイコンをクリックすると一発で出来ます。
範囲指定はEXCELの範囲指定と同じ操作ですので、すぐに理解出来るでしょう。

4.センタリング 
文章を入れる アイコン
どんどん入力してください。別のサイトからコピーした文章、ワープロなどで既に作た文章を、範囲指定してコーピーしていいのです。
改行はEnterキーで、ワープロと同じです。
この枠が、一枚の用紙というイメージです。ただし、縦横伸び縮みする用紙です。
5.タイトル枠の文字をゴジック太文字に
文字の範囲を指定します黒の反転になります アイコンバーの[B] をクリックします
文章を入れる アイコン
どんどん入力してください。別のサイトからコピーした文章、ワープロなどで既に作た文章を、範囲指定してコーピーしていいのです。
改行はEnterキーで、ワープロと同じです。
この枠が、一枚の用紙というイメージです。ただし、縦横伸び縮みする用紙です。

6..文字を修飾します
大きくしたり、斜体字にしたり、アンダーラインを入れることが出来ます。 上の要領と同じです。
文章を入れる アイコン
 どんどん入力してください

別のサイトからコピーした文章、ワープロなどで既に作た文章を、範囲指定してコーピーしていいのです。
改行はEnterキーで、ワープロと同じです。
この枠が、一枚の用紙というイメージです。ただし、縦横伸び縮みする用紙です。
7.色を付ける方法 ツール

アイコンバーに下図のものがあります。

矢印のツールアイコンをクリックすると、
右のカラーパターンが画面右に現れます。

この二つを駆使して文字はもちろん、枠内
(1つだけでなく複数も)の背景色
ページ全体の背景色を変えることが出来ます。




ここにないカラーでも、スポイトツールを使って
他のWindowsから気に入った色を取ってくることが出来ます。
これが、ホームペジビルダーのすごいところです。

○枠内の背景色を付けるには、枠内にカーソルを移動。左クリック
カラーパレットから色を選びダブルクリックする。
  

8.文字に色を付ける 
  1. 文字の範囲を指定する 大きさ、フォントを変えるときと同じ。
  2. カラーパレットから好みの色を選択する。 もしなければ、スポイトで他のWindowsから採集する。
  3. ダブルクリックする。
  4. 色が付きます。
  5. 書体や色、ポイント数をコロコロ変えるのは良くありません。読む方が、精神分裂になります。

9.枠の背景色を変える
  1. 変えたい枠内にカーソルをおき左クリックする。その枠が選択されたことを確認する。
  2. カラーパレットから好みの色を選択する。 もしなければ、スポイトで他のWindowsから採集する。
  3. ダブルクリックする。
  4. その枠内の背景が変わります。 文字色と背景色の組み合わせは重要です。
  5. よく考えてないと、文字が読みにことになりますし、センスを疑われます。
  6. 原色は控えた方がいいでしょう。
 
10..6.の表組みがこのようになりました
文 章 を 入 れ る アイコン
どんどん入力してください

 別のサイトからコピーした文章、ワープロなどで既に作た文章を、範囲指定してコーピーしていいのです。
改行はEnterキーで、ワープロと同じです。
この枠が、一枚の用紙というイメージです。ただし、縦横伸び縮みする用紙です。
   

11.10.の枠表示を非表示にしました
どちらがいいか、一概にいえません。そのページ全体で判断すべきでしょう。  
文 章 を 入 れ る アイコン
どんどん入力してください

 別のサイトからコピーした文章、ワープロなどで既に作た文章を、範囲指定してコーピーしていいのです。
改行はEnterキーで、ワープロと同じです。
この枠が、一枚の用紙というイメージです。ただし、縦横伸び縮みする用紙です。
 
12.作品を保存しましょう
  サイト[lesson1] の中に[lesson5.html] として保存しましょう。  

これで第5回は終わりです。

 back to  room 110 top     goto e-school top