表の作り方

HTML・CSS

htmlファイル

============

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>ホームページのタイトル</title>

</head>

<body>

<h1>ホームページの見出し</h1>

<p>最初のホームページが完成しました！</p>

 

<table border="1">

<tr><td>エコノミーコース</td><td>200円</td></tr>

<tr><td>スタンダードコース</td><td>800円</td></tr>

</table>

 

<table border="1">

<tr><td>エコノミーコース</td><td>200円</td></tr>

<tr><td colspan="2">横２つに繋がる</td></tr>

<tr><td>スタンダードコース</td><td colspan="2">縦２つに繋がる</td>

</tr>

<tr><td>スペシャルコース</td></tr>

</table>

 

</body>

</html>

============

解説

・表を作る時は「table」タグを使う

・「border」タグの数字を利用することで“枠線の太さ”を変更できる

⇨（例）<table border="数字">

・「tr」タグ⇨1行作る

・「td」タグ⇨1列作る

・colspan＝"数字"⇨横に数字列分繋げる

・rowspan="数字"⇨下に数字分繋げる