基本タグ

Webサイト制作で頻繁に使う、見出し・段落・リスト・リンク・画像の要素を学びます。

このLessonのゴール

• 内容に合った見出しと段落を使える
• 順序の有無でulとolを使い分けられる
• リンクと画像へ必要な属性を設定できる

最終制作物とのつながり

With Caféの店舗名、紹介文、特徴、メニューへのリンク、メイン写真をHTMLで作ります。

タグと画面表示の関係

HTMLでは、開始タグと終了タグで囲んだ内容が画面へ表示されます。タグは内容の役割をブラウザへ伝えるためのもので、通常は文字として表示されません。

<h1>With Café</h1>
<p>毎日に、ほっとできる時間を。</p>

コードの部分	画面に表示	役割
<h1>と</h1>	されない	中の文字がページの主見出しであると伝える
With Café	される	見出しの内容
<p>と</p>	されない	中の文字が段落であると伝える
毎日に、ほっとできる時間を。	される	段落の内容

見出しと段落

見出しは h1 から h6、文章の段落は p で表します。

<h1>With Café</h1>
<p>毎日に、ほっとできる時間を。</p>

<h2>私たちについて</h2>
<p>素材の味を大切に、毎朝店内で焼き上げています。</p>