CSSの基本的な書き方とルールを覚える

デイトラWeb制作コース初級編DAY3の学び

【この記事に書いてあること】

プログラミング学習３日目⏩

目標:デイトラDAY３💻

学習時間:３時間１６分⏳

学習内容：CSSの基本的な書き方とルール✏

学び📚
①CSSファイルは相対パスで指定するのが一般的
②セレクタ・プロパティ・バリューという三つの要素
③特定の箇所のスタイルを変更する場合はclassを活用#デイトラ pic.twitter.com/enwhlBvzJj

— ふりっく💻トリプルゼロの（これから）Webマーケター (@FuRiC_twi) January 8, 2021

　【学習時間】

3時間16分

　【学び】

1.
CSSファイルは相対パスで指定するのが一般的
絶対パスだと作業しているフォルダを動かしたときやサーバーにアップしたときなどにパスがズレてリンクが切れてしまう
なので相対パスを使うようにする

2.
セレクタ・プロパティ・バリューという三つの要素
セレクタ { プロパティ: バリュー; }
どこの→セレクタ
何を→プロパティ
どうするか→バリュー
よくある間違いとして、プロパティの右は：（コロン）、値の右は；（セミコロン）であることに注意する

3.
特定の箇所のスタイルを変更する場合はclassを活用

4.
「 > 」で繋げて書くことで、直属の子孫要素だけを指定することができる

5.
font-sizeの値は
px・%・ em　がある
font-size 16pxを倍の大きさにしたいときは
32px ・200%・ 2em と書く

6.
CSSでよく使うプロパティ

・fontの基本「プロパティ」
font-size:文字の大きさ
font-weight：文字の太さ
color：文字の色
font-family：文字のフォント

・テキストの基本「プロパティ」
line-height：行間
text-align：水平位置
vertical-align：垂直位置
text-decoration：テキストの装飾
letter-spacing：文字間のスペース

・背景の基本「プロパティ」
background-image：背景画像
background-size：背景画像のサイズ
background-repeat：背景画像の繰り返し
background-attachment：背景画像の固定・移動
background-color：背景の色

・positionの基本「バリュー」
fixed：スクロールしたらひっついて来る
relative＋方向指定：本来表示される位置からどのくらい動かすか
absolute：親要素からどのくらい動かすか
　　　　　　absoluteとrelativeはセットで使う