2024.10.26 2024.10.27

HTMLとCSSとは？

nyaranyara275

プログラミング初心者向け：HTMLとCSSでWebページを作ろう！

Webページは、私たちが普段インターネットで見ている情報の集まりです。このWebページを作るために、主に2つの言語が使われます。それがHTMLとCSSです。

HTML（HyperText Markup Language） HTMLは、Webページの構造を記述するための言語です。どんな情報がどこにあるのか、という骨組みを作る役割を担っています。例えば、「見出し」「段落」「画像」といった要素をHTMLで記述することで、Webページの土台が作られます。
CSS（Cascading Style Sheets） CSSは、HTMLで作成されたWebページのデザインを装飾するための言語です。文字の色や大きさ、背景の色、レイアウトなど、Webページの見栄えを全てCSSで決めることができます。HTMLが骨組みなら、CSSはそれを彩る装飾と考えてください。
HTMLとCSSの関係 HTMLとCSSは、車のエンジンとボディのような関係です。HTMLがエンジンでWebページの動きを司り、CSSがボディでWebページの見た目を作り上げます。どちらも欠かせない要素であり、連携することで初めてWebページが完成します。

[画像：HTMLとCSSの関係を分かりやすく説明する図]

HTMLの構造は、とてもシンプルです。基本的な構造は以下のようになっています。

HTML

<!DOCTYPE html>
<html>
<head>
  <title>私の初めてのWebページ</title>
</head>
<body>
  <h1>見出し</h1>
  <p>これは段落です。</p>
</body>
</html>

コードは注意してご使用ください。

CSSは、セレクタ、プロパティ、値の3つで構成されます。

CSS

body {
  background-color: lightblue;
}

h1 {
  color: red;
  text-align: center;
}

コードは注意してご使用ください。

HTMLとCSSを組み合わせる方法は、大きく分けて3つあります。

オンライン学習サイト、参考書、コミュニティなどに参加し、入門編から学んでいくと良いですね。

ABOUT ME