贬迟尘濒の基础
- 1. HTML HTML というプログラム言語は文章に対して、意味づけを行うためのマークアップ言語です。 アングルブラケットと呼ばれる <> に囲まれた要素名によってコンピュータがただの文字を意味のある文として認識します。 （例） <h1> ページ内のもっとも重要な見出しです。 <img> 画像を画面に表示させます。 <a> リンクを設定します。 上記のように <> で囲まれた要素をタグと言います。 HTML で用意されているタグの大半は開始タグと終了タグの一対でマークアップしていきます。 （例） < タグ名 > 内容 </ タグ名 > 終了タグには必ずスラッシュ（/）がつきます。 このように、どこからどこまでは ... という内容に対しては開始タグと終了タグが存在しますが、ここで改行！のように 範囲指定のないものは終了タグが存在しません。終了タグが存在しないタグを空タグ（空要素）といいます。 Copyright 2011 TANAKA SHINJI. All Rights Reserved.
- 2. HTML でいう要素とは、開始タグから終了タグまでを指します。 （例） （要素名） （属性） （値） 開始タグ??? <table summary=”△△△” > <tr> <td>○○○</td><td>◇◇◇</td> 要素 </tr> <tr> <td>○○○</td><td>◇◇◇</td> </tr> 終了タグ??? </table> ※例ではテーブルタグを使用している。この場合は table 要素となる。 Copyright 2011 TANAKA SHINJI. All Rights Reserved.
- 3. ブロックレベル要素とは「ひとつの独立した纏まり」のある要素です。文字通り、コンテンツのブロック（かたまり）を定義します。 通常、ブラウザでは前後に改行がもたれて表示します。 ブロックレベル要素は、ブロックレベル要素とインラインレベル要素を梱包することができます。 Copyright 2011 TANAKA SHINJI. All Rights Reserved.
- 4. インラインレベル要素とは「行内の一部」となる要素です。ブロックレベル要素の中で一部のテキストに役割を与えたり、内容を埋め 込むといった要素を指します。 インラインレベル要素は、インラインレベル要素のみを梱包することができます。 Copyright 2011 TANAKA SHINJI. All Rights Reserved.
- 5. Copyright 2011 TANAKA SHINJI. All Rights Reserved.
- 6. １、html の子要素に head タグと body タグ以外のタグが存在する。 ２、body タグの子要素にインライン要素がある。 ３、p タグの中に p タグが存在する。 ４、ul（ol）タグの子要素に li タグ以外のタグが存在する。 ５、dl タグの子要素に dt タグ dd タグ以外のタグが存在する。 ６、インライン要素のなかにブロック要素が存在する。 ７、スタイルを目的としたマークアップを行う行為。 Copyright 2011 TANAKA SHINJI. All Rights Reserved.
- 7. <!--html のコードと文字コードの定義 --> <meta http-equiv=”content-type” content=” text/html;charset= 文字コード” > <!--CSS のコード定義 (HTML 内に CSS を記述するとこのみ必要 ) --> <meta http-equiv=”content-style-type” content=” text/css” > <!--Javascript のコード定義 (HTML 内に Javascript を記述するとこのみ必要 ) --> <meta http-equiv=”content-script-type” content=”text/javascript” > <!-- 検索エンジンのためのキーワードを設定 --> <meta name=”keywords” content=” key01,key02key03” > <!-- 検索エンジンのためのページ紹介文を設定 --> <meta name=”description” content=”紹介文” > <!-- 製作者情報を登録 --> <meta name=”author” content=”名前” > <!-- 著作権 --> <meta name=”copyright” content=”製作年数 著作権利者名（日本語不可）”> <!-- 日付（更新日）--> <meta name=”date” content=”2011-07-22” > Copyright 2011 TANAKA SHINJI. All Rights Reserved.
- 8. タグで囲まれた内容に機能としての意味を持たせる要素で、見出し（h1 ～ h6）や文字の強調（em,strong）などがこのタイプの 要素になります。 タグで囲まれた内容に意味を持たず、見た目の変更だけを目的とした要素で、太字（b）や斜体文字（i）などがこのタイプの要素 になります。 見た目の変更は CSS で行うことを W3C では推奨しているため、物理要素は非推奨のものが多い。 ※スタイルを目的とした属性も廃止傾向があり、CSS での設定が望ましい。 Copyright 2011 TANAKA SHINJI. All Rights Reserved.
- 9. 要素の style 属性で適応 body 内で使用する要素（タグ）には、すべて style 属性があり、style 属性の値として CSS を適応することができるが、 要素一つ一つに style をつけていくのは、大変な作業になります。 <h1 style=” color=#?0000” > 要素の head 内で適応 head 要素内に style 要素を記述し、その style 要素内では CSS 言語を使用することができます。 CSS 言語を html のコメントタグ <!-- --> で囲んでおけば、CSS に対応していなブラウザではテキストとして表示され ることを防げます。 <style type=” text/css” > <!-- h1 { color:#?0000; } --> </style> すべてのスタイルを head 要素内に記述をすると、その内容も検索エンジンは読んでいきますので、あまり使われません。 Copyright 2011 TANAKA SHINJI. All Rights Reserved.
- 10. 外部 CSS を読み込んで適応 head 要素内に link 要素を使って読み込むことができます。 外部 CSS としてまとめて管理しておくことで、後々の管理がしやすく W3C からも推奨されています。 link 要素の rel 属性で HTML との関係性が stylesheet であることを定義し、href 属性で CSS ファイルを呼び出します。 type 属性で text/css とテキストで書かれた CSS ファイルであることも指定してあげる必要があるので注意が必要です。 <link rel=” stylesheet” href=” パス” type=” text/css” > Copyright 2011 TANAKA SHINJI. All Rights Reserved.