こんにちは、Zakkyです。
今回のブログでは、Web制作やコーディング初学者の方向けに「HTML」や「CSS」とは何なのかを
わかりやすく解説していこうと思います。
HTMLとは「HyperText Markup Language」の略で、ハイパーテキストをマークアップする言語です。
ハイパーテキストとは複数の文書を関連付けるしくみのこと、つまり文書中に文字情報だけで、文書構造を表す記号を埋め込んだものです。
そして、この文書に文書構造を表す記号を付けることをマークアップといいます。
見出しや段落、画像などの様々な要素を「HTMLタグ」と呼ばれる目印を利用して文書構造を記していきます。
HTMLファイルはウェブページそのものを表すファイルで、ブラウザはこのファイルを読み込むことでウェブページを表示します。拡張子は「.html」または「.htm」でどちらを使用しても問題ありません。以下にマークアップの簡単な例を示します。
<!DOCTYPE html>
<html lang=“ja”>
<head>
<meta charset=“utf-8”>
<title>テスト</title>
</head>
<body>
Hello World
</body>
</html>
このHTMLファイルをChromeで表示させたものがこちらです。
HTMLが文書構造を指定する言語である一方で、CSS(Cascading Style Sheets)は文書のレイアウトや、装飾などの見た目を指定します。
CSSは「セレクタ」「プロパティ」「値」の3つで構成され、HTML文書の特定の個所を指定してスタイル(色や大きさ、さらには(見出し等の)表示位置)を指定することができます。以下にCSSの簡単な例を示します。
body{
color: brown;
}
先ほどのHTMLファイルに上記のCSSを適用すると下のようになります。
「Hello World」の文字色が変化しました。
HTML文書やCSSの基本構造については、来週のブログに載せようと考えているので、来週もブログに立ち寄ってもらえると嬉しいです。
ではまた来週!
コメント