学科 HTML基礎④
今日のテーマ
レイアウトデザインの練習
CSSの基本構造について
- HTML ファイルとは別に記述する場合
- HTML ファイル内に記述する場合
- HTML タグにインラインで記述する場合
セレクタの記載方法
- 全称セレクタ
- 型セレクタ
- id セレクタ（#）
- class セレクタ（.）
- 子孫結合子セレクタ
- 子結合子セレクタ（>）
- 隣接兄弟結合子セレクタ（+）
- 一般兄弟結合子セレクタ（~）
幅・高さの単位
- px（ピクセル値）
- %（要素の割合（百分率））
- em（要素の割合）
- rem（ルート要素の割合）
- vw（画面の表示幅の割合）
- vh（画面の高さの割合）
- calc 関数（値の計算）
色の指定方法
- カラーネーム
- #rgb（ハッシュ（#）で始まる 16 進数 3 桁）
- #rrggbb（ハッシュ（#）で始まる 16 進数 6 桁）
- #rrggbbaa（ハッシュ（#）で始まる 16 進数 8 桁）
- rgb(r,g,b)（rgb 関数）
- rgba(r,g,b,a)（rgba 関数）
- hsl(h,s,l)（hsl関数）
- hsla(h,s,l,a)（hsla関数）
- 線形グラデーション（linear-gradient 関数）
- 放射グラデーション（radial-gradient 関数）