「HTML書式のメモ」要約1

line
______________________________________________________

 「HTML書式のメモ」の要点をまとめておきますが、後では本文にもあたって、HTMLのコーディングチェックについても見てください。
 ここでは基本中の基本であるパラグラフを考えています。 「HTML書式のメモ」要約2 DTDに続きます。

P tag は container

paragraph break tag になれて下さい。


* HTML:
 改行の目的(separator)で<P>を使うと、右の例のようにとなります。

  <BODY>           <BODY>
  This is a paragraph.<P>   This is a paragraph.
  This is another one.    <P>This is a paragraph.
  </BODY>                     </BODY>

* 構造:

  <BODY> +
          |
          | This is a paragraph. (浮いたテキスト)
          |             (floating text )
          |
          +- <P> +
                 |
                 | This is another one.
                 |               (定義されたテキスト)
                 |               (identified as a paragraph)
          +- </P>+
          |
   </BODY>+

 この文がどうなっているのかに注意をはらって下さい。

 二番目のテキストはパラグラフとして定義されていますが、はじ
めのテキストは定義されていません。
 定義されていないもの(浮いたテキスト)と *Pなどの範囲を囲むタ
グ群( block elements)* の両者がある型をSGMLでは、混在型( a 
mixed content model)があると言い、この混在型はSGML上で問題が
あります。
  
  non-strict HTML(混在にたいして厳格なのをstrict HTMLといいま
 す)では、混在型が<BODY>, <LI>, <DD> and <TD>にあるのを許して
います。

  目的が決められていない浮いた文があることをstrictでは問題にしま
すが、一般的にはブラウザはこの浮いた文をパラグラフとして処理してくれ
ます。しかし、今後は正確にHTMLを書いておくように。

  以下のように、<P>を追加して<P>をcontainerにする。
  <P></P>で、</P>は省略可能です。
 
 * HTML:
 
   <BODY>
   <P>
   This is a paragraph.
   <P>
   This is another one.
   </BODY>

* 構造:

  <BODY> +
       |
          +- <P> +
                 |
                 +- This is a paragraph.
                 |
          +- </P>+
          |
          +- <P> +
                 |
                 +- This is another one.
                 |
          +- </P>+
          |
   </BODY>+

意味を事例でみます。

上の意味を事例でしめします。

また、

 * Pなどの範囲を囲むタグ群(block elements:<P>,<Hy>,<UL>)など
 * この範疇に属しないタグ(<A>,<IMG>,<FONT>など)に注意しておいて下さい。
 * <CENTER>は、定義された内容の範囲をセンタリングします。
 
にも注意をはらって下さい。


*** 事例:A群 囲む意味

 <CENTER>
   <H1>ここは、第一の見出しです。</H1>
 </CENTER>
 
 <CENTER>
   <UL>
   <LI>ULタグは範囲を定義したタグになりますので、
   </UL>
 </CENTER>
 
*** 事例:B群 囲む範囲の指定

  文だけ(それに相当する場合)なら、<P>で範囲を定義しておいて、

 <CENTER>
   <P>範囲を定義した範囲をセンタリングします。</P>
 </CENTER>
 
 <CENTER>
   <P><IMG SRC="aaa.gif" WIDTH=100 HEIGHT=50 ALIGN="RIGHT" ALT="sample">文字
   だけと同じようにします。</P>
 </CENTER>
 
 <CENTER>
   <P><A HREF="URL">文字だけと同じように</A>します。</P>
 </CENTER>


*** Weblintは

 <B> ---------> <STRONG>
 <I> ---------> <EM>
 <CENTER> ----> <DIV ALIGN="CENTER">
 <IMG> -------> WIDTH=" " HEIGHT=" "を記載
 
 を薦めています。

tagを追加していく

Strict HTML 2.0 DTD Referenceを基本に考えるといいでしょう。
 Strict HTML 2.0 DTD Referenceが得られます。  http://www.webtechs.com/sgml/html-2.0/html-2.0strict-index.html

タグの属性の追加
  ALIGNなど
新たなタグ
  <CENTER>
  <DIV>
  <FONT>
  <TABLE>
  
などのタグは、HTML 3.2 DTD Referenceにしたがえばいいと思います。

 W3C HTML 3.2 (Wilbur) DTDが得られます。
 http://www.webtechs.com/sgml/Wilbur/DTD-HOME.html
 他のDTD Referenceも得られます。
 http://www.webtechs.com/html-val-svc/about.html

 そして、HTMLコーディングチェックで確認します。
 これについては、本文でその方法を見てください。 

[HTML書式メモ本文に]

[ホームページ]


 このページのURL:
 JIS版 http://www.asahi-net.or.jp/‾bd9y-ktu/comp_j.html
Last modified 02/12/1997