超初心者のためのホームページ作成講座
HTML CSS Dictionary Netscape Color AccessUp Links SiteMap

■ 画像の挿入

トップページに画像を挿入します。
前のページで背景画像を挿入したけど、ちょっと横においといて・・・。

画像を挿入するには、まず、挿入したい場所にカーソルを移動します。
今回は、見出しの下に画像を挿入するので、見出し行にカーソルがある場合は、 Enter キーを押して、カーソルを次の行に移動して下さい。

改行

ちなみに、Composer で Enter キーを押したときは、HTML では「改行」と認識されます。この「改行」も、HTML においては印(タグ)によって行われます。

つづいて、メニューバーの[挿入]メニューから、[画像]を選択します。
ツールバーの ツールバー画像 をクリックしても同じです。

画像の挿入

[画像のプロパティ]ダイアログボックスが開きました。
一番上の、画像の情報[画像のURL:]に、挿入したい画像ファイル名を入力するか、[ファイルを選択]をクリックして、画像ファイルを選択します。

このときの注意事項は、前のページ「背景画像の設定」で説明しました。
ファイル名を入力するときは、フォルダの指定方法に気を付けること、ファイルを選択するときは、余計な記述は削除しておくこと、の2つでしたね。

画像のプロパティダイアログボックス

次に、[代替テキスト:]を入力します。
これは、画像が表示されない場合に代わりに表示されるテキストです。画像が表示されなかった場合に、そこにはどんな画像が入るのかを簡単に説明しておきます。
また、マウスを当てたときに、ここで入力したテキストが表示されます。

画像のプロバティ 代替テキスト

これで、[OK]をクリックすると、画像が挿入されます。

画像挿入後、左寄せ

これ センタリング を使って画像をセンタリングします。

画像挿入後、センタリング

はい、できましたね。


[画面のプロパティ]ダイアログボックスに、詳細設定ボタン というボタンがあります。
これをクリックすると、画像に関して、もう少し詳細な設定ができます。
覚えなくてもいいですが、だんだん慣れてきたら、ちょっとページのレイアウト等を工夫したくなってきます。そんなときに多少役に立ちます。
ここでは、簡単なものだけ説明しておきます。

画像のプロパティ 詳細設定

[画像サイズの変更]

サイズの指定

これは、画像サイズを変えたい場合に使います。
設定しなければ、[実際のサイズ]で表示されていますが、変えたいときは[ユーザー定義のサイズ]を選択してから希望の大きさを入力します。
[制限]に×がついていますが、これは縦・横の比率を変えないようにする場合です。クリックして×をとると、比率に関係なくサイズを設定できますが、画像の縦横比率を変えてしまうと、画像が歪んでしまうことがあるので、あまりおすすめできません。素材屋さんで禁止している場合も多いので注意して下さい。

[文字列を画像に合わせて配置]

文字列を画像に合わせて配置

画像に対して、文字列をどのように配置するか選択します。
デフォルトは、[下部]で、画像の右側下部に文字列が配置されます。
[上部]は画像の右側上部に文字列が配置されます。
[中央]は画像の右側中央に文字列が配置されます。
以上の3つは、写真など(写真も画像の一種です)を挿入するときに1行程度で、タイトルなどを入れるときに使います。途中で改行はできません。

[左端で折り返す]は、画像の左側に文字列が配置されます。
[右端で折り返す]は、画像の右側に文字列が配置されます。
この2つは、画像や写真の説明を入れるのに適しています。改行することができるので、タイトルを入れてから改行して、説明文を入れることができます。文字列が画像の高さ(縦サイズ)を超える場合は、文字列は画像の下に回り込みます。

[余白]

画像の余白を指定

画像と画像の周囲との余白を設定します。
左右、および上下の余白を設定することができます。文字列を配置するときなど、多少余白があった方が見やすくなります。
画像の周りに枠線を引くこともできます。

この他にも設定できる項目がありますが、ちょっとややこしいので、ここでは省略します。


 Home < Netscape6でホームページをつくろう! < Back < 画像の挿入 > Next