■マウス選択時透明度が増す
hover {opacity: 0.7;}
・opacity
要素を透明にするCSS
0~1までの数値を指定。0に近いほど透明
0.7くらいが変化にも気づき、文字も読める程度の透明度
・hover
指定した要素にマウスが乗ったときだけCSSが反応
例)header li a:hover{opacity: 0.7;}
マウスで選択したときに透明度0.7になる
■ flexについて
justify-content: space-between; 入力するも反応ないので
調べていると display: flex; の入力が漏れていた
■flexについて
① flex-direction
フレックス・ディレクション : 方向;
フレックスアイテムの配置方向を指定
フレックスコンテナの主軸の方向を指定することで、
フレックスアイテムの配置 方向を指定
②align-items
アライン・アイテムズ : 位置
フレックスアイテムのクロス軸方向の揃え位置を指定
フレックスコンテナに指定、内包するフレックスアイテムすべてに適用
③ justify-content
ジャスティファイ・コンテント : 位置
フレックスアイテムの主軸方向の揃え位置を指定
flexで今回使用したのは「align-items」
調べてからチートシート見たら他の2点ものってたけど(他にもいろいろあり)
日本語で解説ないとちょっと理解難しい
現時点でもまとめた3点についても完全には理解できてない。
ほかにもいろいろあるので、覚えるのは難しいとしても
根本的なことは理解してチートシート見るだけで
使いこなせるようにならないと・・
参考資料
できるネット 新たな一歩を応援するメディア