[2] htmlタグの意味

You are here

sample(htmlソース) : index1.htmlは,ブラウザ上でおおむね以下のように表示されます.

株式会社ACORDO

お知らせ

2009-4-1 音楽配信事業開始

mp3フォーマットによる音楽配信事業を開始いたしました.新サイト:Shall We Ensemble? に是非アクセス下さい.

2011-6-4 日本ロービジョン学会発表

守山正樹, 鎌田幹夫, 岩井梢, 触覚を用いたリスクコミュニケーション・ゲームの開発と試行, 第12回 日本ロービジョン学会, P-29, 2011.6.4, 北九州国際会議場

お問い合わせ先

 

[1] htmlファイルでは,index1.htmlというファイルをテキストエディタであるCrescent Eveで表示しました.この情報を「htmlソース」と呼びます.同じ情報をブラウザで表示すると上記のようになります.ブラウザは,htmlソースに書かれたtag情報に従い,tag間に書かれた情報を表示しています.

ソースには,以下の3種類の見出しが使われていますが,それらがブラウザ表示上,異なる様式(文字の大きさ太さなど)になっていることを確認して下さい.

<h1>株式会社ACORDO</h1>
<h2>お知らせ</h2>
<h3>2009-4-1 音楽配信事業開始</h3>

 

<ul></ul>,<li></li>は,箇条書きを指定するtagです.ソースとブラウザの表示を見比べて下さい.<li></li>に囲まれているテキストが,箇条書き形式でリスト表示されています.
<div class="section">は,class属性と呼ばれる書式で,この場合"section"をclass名と呼びます.その表示規則内容は,スタイルシートという別ファイル上で定義します(後述).


htmlファイルを修正し,ブラウザ表示がどう変化するかを調べてみましょう.
  1. <ul></ul>を<ol></ol>に置き換えてみて下さい.なぜ<ul>というtagが必要だったのかが分かると思います.
  2. <li></li>に何かテキストを書き込み,index1.htmlの適切な場所に追記してみて下さい.思ったように表示されるでしょうか.

htmlでは,沢山のtagが定義されています.ブラウザで閲覧しているページにどんなtagが使われているかは,そのソースを見れば分かります.それには,閲覧している状態で右クリックし,"View Page Source"を選択してみてください.htmlソースをみることが出来ます.

その中で,気になるtagがあれば,index1.html中に書き込んで,どういう表示になるのかテストしてみてください.このような試行錯誤を繰り返すと,htmlの世界がどういうものなのか,おおよそ理解できると思います.

それぞれのtagがどのような意味を持っているかは,参考ページのANNEXにあるリンクを参照下さい.