CSSで何ができるの？ざっくりとCSSのイメージをつかもう

どもども

カスタマイザーのくま@Bearface見に来てね♪です(*´꒳​`*)

カスタマイズに必要不可欠なCSSですが、はじめて見た人にとってはよくわからないですよね。

そこで今回は、できるだけやさしく「CSSとはどんなものか」を解説していきます。

CSSのざっくりしたイメージを図解で解説していきますね

とりあえずCSSのイメージだけでも掴んでほしいな

ざっくりとCSSをイメージしよう

ざっくりいうと

CSSはWEBで使われる言語（アイテムみたいなもの）のひとつです。

じゃあCSSのWEBでの役割って？

CSSの役割は 「スタイル（かざりつけ）」です。見た目を変えるために使われます。

CSSで見た目を変えることで、WEBはぐっと見やすくなります。

CSS（かざりつけ）の有り無しを比較してみると

CSS無しでは、文字の大きさ・色などがすべて一緒ですよね。これだとどこを強調したいのかわからないメリハリのない文章に見えます。

CSSを使うことで、見出しがわかりやすく、強調したい部分もメリハリがでます。

CSSで実際になにするの？

基本はこれですね。

この5つです。

なんだそんなに多く無いんだね

プププ、これだけでも十分できるんだよ

それぞれがどんなイメージなのか見ていきましょう。

色を変える

テキストの色を変えるのはもちろん、他にも背景や表などさまざまな部分の色を変えることができます。

大きさを変える

テキストの大きさを変えることができます。高さや幅といったサイズも変更できます。

形を変える

形を変形することもできます。角丸にするのはよく使いますね。

何かを足す

ちょこっとしたアイコンなどを追加することもできます。

何かを消す

逆にどこかを消すこともできちゃいます。

ほいほい、CSSってアイテムを使えば、こんなことができるんやね

だいたいはこの5つを組み合わせてWEBをかざりつけていくよ

カスタマイズとCSS

かざりつけ担当のCSSは、ぼくのようにWordPressのテーマをカスタマイズする人が一番使います。

WordPressのテーマ（例えばSANGO）の中には「style.css（スタイルシート）」というものが入っています。

「style.css」がテーマのかざりつけを決めているファイルです。

カスタマイズする際に「CSS」と言われたら「style.css」を編集していきます。

まぁ、ざっくり CSS＝style.css くらいに思っておきましょう

まーとめ

CSSをいじればどんなことができるのか、ざっくり説明しました。

CSSのカスタマイズで

こんな感じの飾り付けができます。

少しでもカスタマイズのイメージを持ってもらえたら幸いです( ˙꒳​˙ᐢ )