私の好きな物のページの作成 その2

その1からの続きで、ホームページの中の表示部分、BODYの中身の編集を行っていきます。

改行
画像の張り付け
文字のサイズの変更
文字の大きさの変更
文字の位置の変更
リンクの作成

を行います。


まずは、<BODY>と</BODY>の間に文章を書いていきます。

1,改行

しかし、ここでの改行は、ブラウザの方では対応していません。

ブラウザで改行をするには、<BR>という改行タグを
打ち込まないといけません。

 

改行を打ちたいところで、下の図の改行ボタンを使いましょう。

改行ボタンを押すと、自動的に改行されるので、
それを見越して文章を打ちながら利用するのもいいでしょう。

適当に改行タグを入れて編集しましょう。

 

このように感じに編集できていると良いでしょう



2,画像

画像を張り付けます。

最後の一行の「Back」の前にカーソルを合わせてイメージボタンを押します。


右のようなダイヤログがでてくるので、
参照(B)」ボタンを 押して、用意している「hosi_mizu.gif」を選択します。

「OK」ボタンを押せば、

<IMG SRC="hosi_mizu.gif" WIDTH="32" HEIGHT="32">Back
<IMG 〜>の部分が挿入されます。サイズは、Hyper Editが自動で決めてくれます。

これで、画像の張り付けは終了です。



3,フォント

文字の色の変更、サイズの変更を行います。

もともとの設定では、文字の色は
文字の大きさは(7段階中下から3番目)をなっています。

変更する場合は、変更した範囲を選択して
フォントボタンを押します


すると、右のようなダイヤログがでてくるので、
大きさを変えたいときはサイズを変更して、
文字の色を変えたいときはを変更します。

はじめの一文「私の好きなもの」と 最後の一文「Back」は、
それぞれ、サイズを「6」 、色を「a6a6ff」にします。
(色を入力するときは直接入力にしましょう。)

真ん中の「私の好きなものと〜(中略)
       〜紹介していくつもりです。」の部分は

 

色を「a6a6ff」に変更します。

 

 


編集後は右のようになっています


4,センタリング

中央にしたい部分を選択している状態で センタリングボタンを押します

ボタンを押すと、選択した部分が<CENTER></CENTER>に囲まれます。

始めの一文と、
最後の一文(画像を含めて)をセンタリングします。

このとき注意しておくことは、フォントタグやイメージタグを含んでセンタリングしても良いのですが、
このとき、入れ子状態になるように心がけましょう。

(よい例)
<CENTER><FONT SIZE="6" COLOR="#a6a6ff">私の好きなもの</FONT></CENTER>
<FONT SIZE="6" COLOR="#a6a6ff"><CENTER>
私の好きなもの</CENTER></FONT>

(悪い例)
<CENTER><FONT SIZE="6" COLOR="#a6a6ff">
私の好きなもの</CENTER></FONT>
<FONT SIZE="6" COLOR="#a6a6ff"><CENTER>
私の好きなもの </FONT></CENTER>


5,リンク

ハイパーリンクを貼ります。リンクを貼りたい部分を選択している状態で「他の文章にリンク」ボタンを押します。

「Back」の部分にindex.htmlへのリンクを張るので、
Backを選択した状態で「他の文書にリンク」ボタンを押します。

右のダイヤログがでてくるので、
参照(B)」ボタンを押し、「index.html」を指定します。



これで、page2ができました。ソースの最終系は次のようになっているでしょう。



また、作業中にブラウザでどのようになっているかをチェックしたければ。
「ブラウザでプレビュー」ボタンを使ってチェックしてみるといいでしょう。