HTML作成編

3.書式関連タグ




「Welcome!The PurPose」を書式タグを使いながら変えていきます。

<font size=5>Welcome!</font>
<font size=6><b>The PurPose</b></font>
Welcome! The PurPose

 <center>〜</center> (中央に揃える)
<center>
<font size=5>Welcome!</font>
<font size=6><b>The PurPose</b></font>
</center>
Welcome! The PurPose

 <p> (段落)
<p align=left>〜</p> (段落し左に揃える)
<p align=right>〜</p> (段落し右に揃える)
<p align=center>〜</p> (段落し中央に揃える)
<center>
<font size=5>Welcome!</font>
<p>
<font size=6><b>The PurPose</b></font>
</center>
Welcome!

The PurPose

<center>
<font size=5>Welcome!</font>
<p align=left>
<font size=6><b>The PurPose</b></font>
</p>
</center>

Welcome!

The PurPose

<center>
<font size=5>Welcome!</font>
<p align=right>
<font size=6><b>The PurPose</b></font>
</p>
</center>

Welcome!

The PurPose

<font size=5>Welcome!</font>
<p align=center>
<font size=6><b>The PurPose</b></font>
</p>

Welcome!

The PurPose

 <br> (改行)
<br clear=left>
<br clear=right>
<br clear=all>
<center>
<font size=5>Welcome!</font>
<br>
<font size=6><b>The PurPose</b></font>
<center>
Welcome!
The PurPose

ここでは、 clear=left,right.allの使い方を示しました。
多くは、語りません。clea=***の部分を外したりして違いを見て下さい。

<img src="images/purlogo_k.jpg" align=right>
このHomePageはLink集です。主に、Windos関連及びパソコン初心者を対象と した構成になっています。(勉強部屋もあるョ!)。そうでない物もありますが(^_^;。
<br clear=right>
Macintoshd使用の方又は、パソコン経験豊富な方々には 〜クダラナイHomePage〜 となっており違うPageに移られた方が良いかもしれません。
<br clear=all>
<img src="images/purlogo_k.jpg" align=left>
それでも、という方はどうぞ"ENTER"をクイックし入室して下さい。又、初めて入室される方は、 必ず"information"(info)をお読み下さい。
<br clear=left>
ブラウザは、できればフレーム及びJavaScript対応ブラウザで観覧することをお勧めします。


このHomePageはLink集です。主に、Windos関連及びパソコン初心者を対象と した構成になっています。(勉強部屋もあるョ!)。そうでない物もありますが(^_^;。
Macintoshd使用の方又は、パソコン経験豊富な方々には 〜クダラナイHomePage〜 となっており違うPageに移られた方が良いかもしれません。
それでも、という方はどうぞ"ENTER"をクイックし入室して下さい。又、初めて入室される方は、 必ず"information"(info)をお読み下さい。
ブラウザは、できればフレーム及びJavaScript対応ブラウザで観覧することをお勧めします。

 <nobr>〜</nobr> (改行しない)
<center>
<font size=5>Welcome!</font>
<p>
<font size=6><b>The PurPose</b></font>
<center>
<p>
フレーム及びJavaScript対応ブラウザで観覧することをお勧めします。

Welcome!

The PurPose

<nobr>を使わない場合

フレーム及びJavaScript対応ブラウザで観覧することをお勧めします

<center>
<font size=5>Welcome!</font>
<p>
<font size=6><b>The PurPose</b></font>
<center>
<p>
<nobr>
フレーム及びJavaScript対応ブラウザで観覧すること
をお勧めします。
</nobr>

Welcome!

The PurPose

フレーム及びJavaScript対応ブラウザで観覧することをお勧めします。

次は、いろいろなインデントを使ってみよう。

 <ul><li>〜</ul> (記号での箇条書き)
<ul><li type=square>〜</ul>
<ul><li type=disk>〜</ul>
<ul><li type=circle>〜</ul>
※ 「type=*」を指定していない場合と、
 <ul><litype=disk>〜</ul>とは表示は同じ
<ul src="***.gif">
 (対応するブラウザは、ほとんど無いようです)
<ul compact> (   〃   )
 <ol><li>〜</ol> (番号での箇条書き)
<ol><li type=1>〜</ol>
<ol><li type=A>〜</ol>
<ol><li type=a>〜</ol>
<ol><li type=i>〜</ol>
<ol><li type=l>〜</ol>
※ 「type=*」を指定していない場合と、
  <ol><li type=1>〜</ul> とは表示は同じ
使い方を3例ほど載せます。
(ここでは、Internet Explorer、Netscapeで表示されるものを抜粋します。)

<b>フレーム編</b>
<br>
<ul>
 <li>二つに分割してみよう
 <li>分割の応用
  <ol>
   <li>四分割
   <li>五分割その1
   <li>五分割その2
  </ol>
 <li>フローティングフレーム
</ul>

フレーム編
  • 二つに分割してみよう
  • 分割の応用
    1. 四分割
    2. 五分割その1
    3. 五分割その2
  • フローティングフレーム

<b>フレーム編</b>
<br>
<ul>
 <li type=square>二つに分割してみよう
 <li>分割の応用
  <ol>
   <li type=a>四分割
   <li>五分割その1
   <li>五分割その2
  </ol>
 <li>フローティングフレーム
</ul>

※ <li type=square>は、Netscapeの方は、変わっています。

フレーム編
  • 二つに分割してみよう
  • 分割の応用
    1. 四分割
    2. 五分割その1
    3. 五分割その2
  • フローティングフレーム

<b>フレーム編</b>
<br>
<ol>
 <li type=A>二つに分割してみよう
 <li>分割の応用
  <ol>
   <li type=i>四分割
   <li>五分割その1
   <li>五分割その2
  </ol>
 <li>フローティングフレーム
</ol>

フレーム編
  1. 二つに分割してみよう
  2. 分割の応用
    1. 四分割
    2. 五分割その1
    3. 五分割その2
  3. フローティングフレーム

 <dl><dt>〜</dl> (番号なし入りご子)
 <dl><dd>〜</dl> (インデント付き、番号なし入りご子)
<b>フレーム編</b>
<br>
<dl>
 <dt>二つに分割してみよう
 <dt>分割の応用
  <dl>
   <dt>四分割
   <dt>五分割その1
   <dt>五分割その2
  </dl>
 <dt>フローティングフレーム
</dl>

フレーム編
二つに分割してみよう
分割の応用
四分割
五分割その1
五分割その2
フローティングフレーム

<b>フレーム編</b>
<br>
<dl>
 <dd>二つに分割してみよう
 <dd>分割の応用
  <dl>
   <dd>四分割
   <dd>五分割その1
   <dd>五分割その2
  </dl>
 <dd>フローティングフレーム
</dl>

フレーム編
二つに分割してみよう
分割の応用
四分割
五分割その1
五分割その2
フローティングフレーム

 <blockquote>〜</blockquote> (引用文などとして使うと良い)
<b>HTMLを作るには?</b>
<blockquote>
HTMLファイルを作のには、特別なソフトウエアなどはいりません。<br>
WindowsですとNotepad(メモ帳)などに記入します。<br>
保存する時に拡張子を「html」或いは、「htm」にして<br>
「保存(S)」ボタンを押すとHTMLファイルの出来上がりです。
</blockquote>
<b>HTMLの作り方</b>
<br>


HTMLを作るには?
HTMLファイルを作のには、特別なソフトウエアなどはいりません。
WindowsですとNotepad(メモ帳)などに記入します。
保存する時に拡張子を「html」或いは、「htm」にして
「保存(S)」ボタンを押すとHTMLファイルの出来上がりです。
HTMLの作り方



書式とは違いますが、ここで水平線のタグを載せます。
 <hr> (陰影付き)
<hr noshade> (陰影なし)
<hr color="#******"> (色を付ける)
<hr width=*> (長さ ピクセル数が%で指定)
<hr size=* > (太さ)
<hr align=left > (左に寄せる)
<hr align=right > (右に寄せる)
<hr align=center > (中央に構える)
いろいろと組み合わしてみよう。

<hr>

<hr noshade>


<hr color="#00ff00">
 色を指定した場合陰影は、付かない
  又、Netscape,Internet Explorer2.0では、色は付かない様です。


<hr width=50%>


<hr width=100 noshade>


<hr size=5 width=50%>


<hr size=10 width=100 noshade>


<hr size=5 width=50% align=left noshade>


<hr size=10 width=100 align=right>


<hr size=10 color="#ff0000" width=100 align=right>




次のPAGEは、表(テーブル)関連タグです。




戻る
次へ




The Purposeロゴ
http://www.web-purpose.com/purpose/
Copyright (C) 1997-2005 Tomio Sato. All Rights Reserved.