1)テキストの入力

やさしいホームページの作り方(1)で示したホームページの基本構造の<BODY>   </BODY>の間に文字を記入すればブラウザでホームページ上にそれを見ることが出来る。ホームページを継続して作っていくと定型的なページができてくる。そのときこれをテンプレートとして用意しておけば効率よく制作できる。

○文字のサイズ

見出し文字の場合(太字)大きい順に、改行のための特別な指示はいりません

<H1>横須賀市</H1>

横須賀市

<H2>横須賀市</H2>

横須賀市

<H3>横須賀市</H3>

横須賀市

<H4>横須賀市</H4>

横須賀市

<H5>横須賀市</H5>
横須賀市
<H6>横須賀市</H6>
横須賀市

一般の文字の場合 普通の書体です。数字が逆になっています。
改行のための指示(<BR>)が必要です

<FONT SIZE=7>横須賀市</FONT>
横須賀市
<FONT SIZE=6>横須賀市</FONT>
横須賀市
<FONT SIZE=5>横須賀市</FONT>
横須賀市
<FONT SIZE=4>横須賀市</FONT>
横須賀市
<FONT SIZE=3>横須賀市</FONT>
横須賀市
<FONT SIZE=2>横須賀市</FONT>
横須賀市
<FONT SIZE=1>横須賀市</FONT>
横須賀市

FONT SIZEを指定しない場合はSIZE=3となります

○文字のサイズと色の指定

<FONT SIZE=5 COLOR=RED>横須賀市</FONT>
横須賀市
<FONT SIZE=5 COLOR="#FF0000">横須賀市</FONT>
横須賀市
<FONT SIZE=5 COLOR="#0000FF">Blue</FONT>, Blue
<FONT SIZE=5 COLOR="#008000">Green</FONT>, Green
<FONT SIZE=5 COLOR="#FFFF00">Yellow</FONT>, Yellow
<FONT SIZE=5 COLOR="#000000">Black</FONT>, Black

○文字の編集

太字(ボールド)にする場合      

<B>横須賀市</B>
横須賀市

イタリックにする場合         

<I>横須賀市</I>
横須賀市

下線(アンダーライン)を引く場合   

<U>横須賀市</U>
横須賀市

太字でイタリックの場合

<B><I>横須賀市</I></B>
横須賀市

行間にスペースを入れる場合

<B>横須賀市</B>
<P>
<B>横須賀市</B>
横須賀市


横須賀市

行間に罫線を入れる場合

<B>横須賀市</B>
<HR>
<B>横須賀市</B>
横須賀市


横須賀市

文字をセンターに配置する場合

<CENTER>
<H5>横須賀市</H5>
</CENTER> 

横須賀市



○文章の入力と編集の演習

 文章を実際に入力して体裁を整えてください。

○コーデイング中の覚え書き

<!ここから今城が担当> このタグは無視され画面に表示されません

---------------------------------------------------
まとめ これまでに登場したタグ一覧
どんな指示をしているか分かりますか
----------------------------------------------------

<HTML> </HTML>Hypertext Markup Language
<HEAD> </HEAD>Document Head
<TITLE> </TITLE>Document Title
<BODY> </BODY>Document Body
BGCOLOR=WHITEBackground Color
BACKGROUND="bgimage/bghama.gif"Background Image
TEXT=NAVYText Color
<H1> </H1> Heading
<FONT SIZE=1> </FONT>Font Size
<FONT COLOR=RED> </FONT>Font Color
<BR>Break
<B> </B>Bold style
<I> </I>Italic style
<U> </U>Under Line
<P>Paragraph
<HR>Horizontal Rule
<CENTER> </CENTER>Centering
<! by Motoi Imajo>Comment Tag


2006年8月1日