cssで背景色を変えてみよう。

プログラミング

どうもみなさんこんにちは!ryutaです!今回はcssとhtmlを組み合わせて使ってみようというテーマで解説しようと思います。。htmlとはテキストについてのプログラミングでcssとは全体的な装飾に使うプログラミングです。それをうまく使って綺麗なサイトやホームページなどを制作していきましょう。

cssで背景色を変更する

まずはcssで背景色を変更していきましょう。cssで背景色を変更するには「backgrpund_color」を使ってプログラムしていきます。コードで書くと次にのようになります。(背景色を赤色にする場合)

backgorund-color : red

こうすることで背景が赤になります。red,blueなどと色の名前を打っていく方法もあるんですが、より多くの細い色を使いたい場合は

WEB色見本 原色大辞典 - HTMLカラーコード
色の名前とカラーコードが一目でわかるWEB色見本

上のようなサイトから番号を指定して先程の色の名前を書いた部分に好みの色の番号を当てはめてみると、より一層自分好みのサイトに仕上がるかもしれません。

一つの要素だけ色を変えたい!

一部分だけの色を変更したい!と思った時はclassを使って名前をつけるとその部分だけを変えることができます。ここは少し長くなってしまうのでまた別の記事で詳しく説明します。現時点ではclassを使って分別ができるんだなくらいに思っておいてもらえれば大丈夫です。

HTMLの全体図を再確認

ここで一度htmlの全体図を確認しておきましょう。僕自身もそうだったんですが、一番最初にhtml勉強した時ってもぉ何がなんだかわからないんですよね。なんのでこまめに確認していきましょう。

まず htmlの中にはheadとbodyがあって、headはページに関する情報が詰まっていて、表示されることはありません。bodyは実際表示したい部分があります。そして必ず<!DOCTYPE html>という文字を書き込みます。これはdoctype宣言というものです。これは必ず記述する必要があります。

これが全体の構図です

まとめ

今回はここまでです。cssで背景色を変えるにはbackgrpund_colorで指定する。HTMLはhead,bodyに分かれていて、doctyoe宣言をする必要がある。

これを理解できるようにしましょう。

コメント

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