【ゼロから学ぶHTML/CSS】HTMLとCSSの機能と概要について【マークアップ/ハイパーリンク/スタイルシート/#2】

HTML/CSS
HTML/CSS

HTMLの機能と概要

HTML(HyperText Markup Language)の機能は主に「リンク」「マークアップ」です。

リンク(ハイパーリンク)

WEBサイトでは、文字や図をクリックして、別の場所や別のファイル、外部のWebサイトに移動します。

他にも、Google検索を行い、検索結果をクリックしてWebサイトに移動します。Webページの目次をクリックして、同じページ内の目的の章へ移動します。

このようなリンク機能を「ハイパーリンク」と言い、この機能を持つ文書のことを「ハイパーテキスト」と言い、ハイパーテキストは「HTMLファイル(.html)」のことです。

マークアップ

文書にタグ付けすることをマークアップと言います。

HTMLではテキストを「<〇〇〇>~テキスト~</〇〇〇>」のようにタグ(<〇〇〇>)で囲み、テキストに何らかの意味を持たせます

Webページを作るというのは、HTMLファイルでテキストにマークアップを行い、「段落」、「見出し」、「リスト」のように意味づけをしていくことです。

マークアップを行い、文書の構造を作っていきます。

HTMLのバージョン

HTMLにはバージョンがあります。執筆現在の主流バージョンはHTML5.2です。

バージョンが変わると、一部の記述が特定のバージョンでしか使えないものだったり、意味が違ったりしますが、基本的な書き方は大差が無いです。これから学ぶ、新しくWEBサイトを作る人は、とりあえずHTML5を採用すれば良いです。

CSSの機能と概要

CSS(Cascading Style Sheets)の機能は「スタイリング」「継承」です。

スタイリング

CSSは文書のデザインについてまとめたデータファイル(.css)のことで、スタイルシートと呼んでいます。

本来、HTMLは文書の構造を決めるための物で、レイアウトを整えたり、装飾するのはCSSで行います。よく服の着せ替えで例えられるように、見た目だけを変更したい時はCSSを修正するだけで、変更できます。HTMLは文書構造、CSSはスタイリングと分けて考えることで、Webサイトのメンテナンスが効率的になります。

継承

HTMLでマークアップした構造に対して、CSSで指定してスタイルを決めるのですが、指定した構造(タグ)の子供の構造(子タグ)にも同じスタイルが適用、つまり継承される場合があります。また、継承される/されないものを強制的に継承させない/させることもできます。

また、HTMLの文書構造を途中で書き換えたとしても、書き換えた構造がCSSで指定したものと一致していれば、書き換え後も継承してスタイリングされます。

コメント

タイトルとURLをコピーしました