色の指定方法
キーワード(red)などで、色を指定することができます。
RGBAで、色を指定することができます。
RGBAは,
赤(red)緑(green)青(blue)透度(alpha)の略で、
0-255の数字もしくは16進数(00-ff)で表現すればOKです。
HSLAで、色を指定することができます。
HSLAは,
色相(Hue)彩度(Saturation)明度(Lightness)透明度(Alpha)の略で、
色相は0-360、それ以外は0-100で表現すればOKです。
opacityプロパティを使うことで、要素全体の透明度を調整できます。
![](https://tumaboki.com/wp-content/uploads/2020/11/d740fa96b1390d3e2ee3f38d2ee18a07.png)
![](https://tumaboki.com/wp-content/uploads/2020/11/6f61636708e73acedd8e6fae9734fcb1.png)
リストのスタイリング
list-style-typeプロパティを使うことで、リスト先頭の記号を変更できます。
値:circleで白丸になります。
値:lower-alphaで英語になります。
値:noneで記号なしになります。
list-style-position:を使うことで、リスト記号の位置を変更できます。
値:insideにすると、要素ボックスの内側になります。
![](https://tumaboki.com/wp-content/uploads/2020/11/b9c77082a1a4576fd13571984a93476f.png)
![](https://tumaboki.com/wp-content/uploads/2020/11/cc6ae857805df896c96d04bb906d4053.png)
一括指定プロパティ
list-styleプロパティを使うと、typeとpositionとurl()をまとめて指定できます。
一括指定プロパティを使うと、初期値で設定が上書きされるので注意しましょう。
![](https://tumaboki.com/wp-content/uploads/2020/11/cabe4c57f44a0d44c3a22a98cac72349-1024x398.png)
![](https://tumaboki.com/wp-content/uploads/2020/11/62a2b2557fe66b3bd9eec94dac1d68f6.png)
コメント