こんにちは、MSKです。
無事プログラミング学習2日目に入ることができました。
1日目はこちら↓
プログラミング学習2日目
ちゃんと今日もドットインストールを開くことができてホッとしました。
なんだかんだ理由をつけて勉強さぼるとか、今までの自分なら十分あり得ましたからね。
何はともあれ、今回も学んだことをまとめていきたいと思います。
学んだこと
CSS
HTMLを学ぶ際にCSSと呼ばれるものを同時に学んでいきます。
CSSはHTMLと組み合わせて使用する言語。
HTMLがWebページの概要や細かな情報を定義し、CSSがそれらのフォントやサイズなどの見た目(スタイル)を定めていく。
設定の仕方
まずは、HTMLファイルとは別でCSS用のファイルを作ります。
その後、HTMLファイルの<head>タグ内に<link>タグを入れて、新しく作成したCSSファイルを読み込む方法が一般的です。
【例】
<head>
<title> サイト・ブログのタイトル </title>
<link rel=”stylesheet” href=”フォルダー名/ファイル名”>
</head>
これで、HTMLとは別に作ったCSSファイルが読み込まれます。
CSSの中身
CSSファイルの中には、HTMLファイルで作成した元となる文章や画像の配列を整えるためのコードを書いて行きます。
具体的には、「<h1></h1>で囲まれた文は赤色にする」「画像は中央揃えで配列する」と言ったことなどを決めて行きます。
【例】
h1{ color : red ; }
上のコードはh1タグで囲まれた文章を赤色で表現するためのコード。CSSの3つの要素と言われているセレクタ・プロパティ・値は以下の通り。
- h1:セレクタ
- color:プロパティ
- red:値
color:色を指定する
font-family:フォントを指定する
width:幅を指定する
ここで紹介するコードは、ほんのちょっぴりなので興味のある方は調べて見てください。
まとめ
CSSは、HTMLを修飾するためのものです。
うまく使うことで簡素なデザインのWebページを鮮やかなものに作り変えることができます。
ではまた!
3日目はこちら↓
Twitterにアカウントがあるので、是非フォローして話かけて下さい!
また、この記事が役に立ったらSNSで紹介してもらえると嬉しいです!