「初学者必見」HTML,CSSとは

coding-on-laptop CSS

こんにちは、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の基本構造については、来週のブログに載せようと考えているので、来週もブログに立ち寄ってもらえると嬉しいです。
ではまた来週!

 

twitterのフォローはこちらから!@codingblogg
Amazon APIのアクセスキーもしくはシークレットキーもしくはトラッキングIDが設定されていません。「Cocoon設定」の「API」タブから入力してください。

コメント

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