ここでは、IT系企業の新入社員向けにHTMLを解説しています。

デザイナーになるほどHTMLに詳しくなくてもいいけれど、Webアプリを作る上で必要な入力画面は自力で作りたい、あなたのためのページです。

2.見出し、ヘッダーとフッターを作成する

見出し

見出しを使うと文章の構造を示すことができます。

h1~h6まであり、数字が大きいほどだんだん細かい見出しになります。

hというのはheading(見出し)という意味です。

 

ソースの例は以下の通りです。

 

ブラウザで確認してみましょう

 

h1が一番大きく、徐々にサイズが小さくなっていますね。

表示したい見出しのサイズに応じて、h1~h6を使い分けます。

また、今回一切の装飾がありませんが、装飾はCSSのところで扱います。

 

ヘッダーとフッター

 

ヘッダーとフッターについて説明していきます。

ヘッダーとはページの一番上のほうにある部分です。

弊社のトップページで言えばこの部分です。

 

フッターとはページの一番下のほうにある部分です。

この部分です。

 

サイドバーは横にある部分です。

これは、右サイドバーの例です。(今回サイドバーは作りません)

そしてそれ以外がコンテンツ部分になります。

 

ソースは下記のようになります。

前回学んだbodyタグの中に描いていきます。

 

ヘッダーやフッター、サイドバーを作っておくとそのグループごとにCSSで装飾を施すことができ、

文書の論理構成を示すことができます。

 

今回は「見出し、ヘッダーとフッター」を作りました。

次回は、「段落と改行」について学んでいきましょう。