Webサイト作成A（第09回） – 日本経済大学情報系講座資料集

HTMLタグ

html

HTML文書全体を表す

<html></html>

head

HTML文書の設定（メタ情報）

<head></head>

body

HTML文書の本体であることを表す

<body></body>

title

HTML文書の名前を指定する

<head>内に記述する

<title></title>

h1〜h6

見出しを表す

「heading」の「h」

<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>

p

段落を表す

「paragraph」の「p」

<p></p>

a

段落を表す

「anchor」の「a」

href：「HyperText Reference」参照先の情報

<a href="URL"></a>

ul

順番なしリストを表す

同格のリストや箇条書きに

「unordered list」のul

li：リスト項目

<ul>
	<li>リスト項目</li>
	<li>リスト項目</li>
	<li>リスト項目</li>
</ul>

ol

順番ありリストを表す

手順や流れなど順序のあるリスト

「ordered list」のol

li：リスト項目

<ol>
	<li>リスト項目</li>
	<li>リスト項目</li>
	<li>リスト項目</li>
</ol>

dl

定義リストを表す

言葉の説明などのリスト

「definition list」のdl

dt：定義する用語：「definition term」

dd：用語の説明：「definition description」

<dl>
	<dt>用語1</dt>
	<dd>用語1の説明</dd>
	<dt>用語2</dt>
	<dd>用語2の説明1</dd>
	<dd>用語2の説明2</dd>
</dl>

section

文章や情報のまとまりを表す

<section></section>

div

グループ化する

<div></div>

span

範囲指定する

<span></span>

br

改行する

終了タグは不要

<br>

img

画像を表示する

src=”画像のURL”

alt=”画像の説明”

終了タグは不要

<img src="flag.png" alt="国旗（こっき）の画像">

本日の提出課題例

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学籍番号</title>
</head>
<body>

<section>
    <img src="https://idia.jp/cat.jpg" alt="猫の画像">
</section>
    
</body>
</html>