30daysトライアル2ndのDay22のモーダルを作る
という課題で自作のモーダルを作るときにとても大切なinputとforについて理解したので備忘録として以下にまとめます◎
参考にしたのは
https://haniwaman.com/css-modal-drawer/#i-4
こちらの記事です

forは
inputにチェックを入れられるor外す物を指定できる

簡単に言い換えると…
for="" は　input のチェックを外すスイッチみたいなもの。いくつも指定できる
スイッチを押すとinputのチェックが外れる

ルールは…
・inputにチェックを入れたいときにfor="inputのID"を指定すればOK
・forでinputにチェックを入れたい場合divではなくlabelにしないといけない

cssには『#inputのID』:checked:（『#inputのID』にチェックが入ったら、
『#inputのID』 が〇〇される
例：

nav-input:checked ~ #nav-close {

                    display: block;/*カバーを表示*/
                    opacity: .5; 
                  }

〇〇を押すと非表示になる設定は『for="nav-input"』で〇〇を押したらチェックが外されるように指定するとできる