HTMLとCSS

HTML&CSS

こんにちは!belulu(ベルル)です!

Webページで欠かせない言語と言えば
HTML・CSSですが、それぞれどんな役割をしている言語なのでしょうか?

Webデザインの勉強でもまずはじめにHTML、CSSを学ぶことが多いです。
今回は初心者の方にもわかるようHTMLとCSSを説明します。

Belulu
Belulu

この記事をおすすめしたい方

・これからプログラミングの勉強を始める人

・HTML、CSSってよく聞くけど一体何?と疑問に思っている人

HTMLとは

HTMLとは、Hyper Text Markup Language(ハイパーテキスト・マークアップ・ランゲージ)
の略であり、ホームページをブラウザに表示するためのプログラミング言語です。

Webページの構造をつくるのに使われていて、
インターネット上に公開されているWebページのほとんどはこのHTMLで作成されています。

『<』『>』で挟む特殊なタグと呼ばれる文字列で、表示したい文章を囲んで書いていきます。

CSSとは

CSSとは、Cascading Style Sheet (カスケーディングスタイルシート)の略であり、
Webページのデザインやスタイルを指定するための言語です。

「スタイルシート」とよばれることが多いです。

HTMLと組み合わせて使用し、色や文字、背景、画像、レイアウトを指定する役目をしています。

CSSがわかれば、Webページをおしゃれに整えることができます。

HTMLとCSSのちがい

HTMLとCSSについてそれぞれ説明しましたが、結局は何が違うの?と疑問をお持ちの方も
いらっしゃいますよね。
ここでは二つの言語の違いとその関係性を説明します。

HTMLはページの構造をつくり、
その構造に装飾(デザイン)していくのがCSSです。

CSSは必ずHTMLファイルとセットで作動し、単体では使うことが出来ません。

分かりやすく画像で説明しますと、下記のようなHTMLファイルがあります。

これをプラウザ上で見るとこうなります。

ここに、装飾を加えるCSSファイルを読み込ませます。

↓ ↓ こうなります!!

CSSファイルがないと、黒のとってもシンプルな文字が並ぶだけのページになってしまいますが、
CSSファイルを使うと、文字色が指定できたり、背景をつけたり、レイアウトをアレンジすることができて
見やすいページになります!

HTML、CSSの勉強方法

プログラミングをこれから勉強してみたいけど、
どうやったらいい??とお悩みの方へ

HTMLとCSSは、独学でもある程度学ぶことが可能だと言われています。
本もたくさん発売されていますし、
分からないことがあっても、検索するとWEB上にもたくさんの情報があります。

それから、無料の学習サイトでまずは学んでみるのも個人的にはおすすめです。
言語に触れてみて、もっと深く学びたい。分からない所を質問したい!となれば
スクールや有料の学習サイトを利用するのもいいでしょう。