HTML&CSS

HTML&CSSとは

HTML&CSSとは

Webページは「HTML」と「CSS」という言語を組み合わせて作られています。

HTMLとCSSを学ぶことで、いつも目にしているWEBサイトのような見た目のサイトを作れるようになります。

HTML(エイチティーエムエル)とは

HTMLとは「HyperText Markup Language」の略で、WEBページを作成する時に文書を構造化するための言語でマークアップ言語といいます。

HTMLは小なり記号「<」と大なり記号「>」で囲まれたタグを用いて、文書に見出しや箇条書き、テーブルなどの「構造」を持たせることができます。

HTMLによって作られた文書のことを「HTMLファイル」と呼び、拡張子は「.html」、もしくは「.htm」です。

CSS(シーエスエス)とは

CSSとは「Cascading Style Sheet」の略で、作成されたHTMLの見た目や装飾を整えるものでスタイルシート言語ともいいます。

HTMLがWEBページの内容や構造を指定するものであるのに対して、WEBページのデザイン(スタイル)を指定する役割となり、HTMLとCSSを組み合わせることによって、見栄えのよいWEBページを作成することができます。

また、CSSを使うことによって論理構造(HTML)と視覚表現(CSS)が分離でき、WEBサイト全体のデザインやファイルの管理がしやすくなります。

HTMLの仕組み

HTMLでは、テキストに「タグ」と呼ばれる印を付けていきます。

下記のコードのようにテキストをタグで囲むことにより、テキストが「見出し」や「リンク」といった意味をもつことになります。

 html
<h1>プログラミング学習</h1>
<a href="https://issy9174.com/">https://issy9174.com/</a>

開始タグと終了タグ

テキストをタグで囲む時は、下記のコードのように、開始タグと終了タグではさみます。

終了タグには「/(スラッシュ)」が必要になります。

 html
<h1>見出しタグ</h1>
<a>アンカータグ</a>
<br>改行タグ</br>
<font>フォントタグ</font>
<li>リストタグ</li>

CSSの仕組み

CSSとは、HTMLの要素に対して色、大きさ、配置などを指定し、ページをデザインするための言語です。

CSSは、HTMLとは別のファイルに記述し、HTMLで用意した要素に対して、CSSを用いて「どこの」「何を」「どうする」かを指定することができます。

セレクタとプロパティ

下記のコードのように対象(要素名)をセレクタ、変更項目をプロパティと言います。

 html
h1{
	color: red;
}

インデント(字下げ)

HTMLと同様にCSSを記述していく場合はインデント(字下げ)をします。

また、CSSのプロパティの末尾にはコロン(:)、行末には セミコロン(;) をつける必要があります。







-HTML&CSS

© 2021 Issy9174 official web site