学習中にbackground:transparent
という値を設定することがあったので備忘として残す。
transparent
とは要素を透明にするものであり、transparent
を指定すると要素の色が完全に透明になりるが、opacity
やrgba
の様に透明度を変更することはできない。
実際の使用イメージ
下記がtransparentを設定していないときのinput要素である。
![](https://junjunjp.com/wp-content/uploads/2024/01/スクリーンショット-2024-01-30-9.06.24.png)
input {
// background: transparent;
outline: none;
color: white;
border: none;
}
次にtransparentを設定しているときのinput要素が下記。
![](https://junjunjp.com/wp-content/uploads/2024/01/スクリーンショット-2024-01-30-9.07.30.png)
input {
background: transparent;
outline: none;
color: white;
border: none;
}
見事にinput要素の色が消え、それ以外のclassに付与されている色となった。