HTML
class
divに付ける名前、グループ名のこと
最低限のルールを守れば、命名規則に関して正解はない
意味の分かる名前をつけること
div
単体では特に意味を持たないタグだが、divで囲った部分をブロックレベル要素としてグループ化することができるタグ
span
囲んだ要素を強調するなどのデザイン微調整によく利用されるタグ
個別にテキストのフォント調整、文字色・背景色の変更を施す
container wrapper
開発チームや人によって使い方は様々
containerは画面内のコンテンツの収まる範囲を設定するブロックで、
コンテンツを一定の範囲内で整列させる役割を持つ
https://note.com/msak717/n/nd39608804fe0#H7fby
CSS
background-size: cover;
1枚の画像で表示範囲を埋め尽くすように画像の大きさが拡大縮小する
hover
カーソルが乗ったときの状態を指す
セレクタ:hoverとすることで、カーソルが乗ったときのCSSを指定することができる
border-radius
角を丸めるにはborder-radiusプロパティを用いる
transition
transitionを使うとアニメーションをつけることができ、「変化の対象」や、「変化にかかる時間」などを指定できる
transitionは多くの場合hoverと組み合わせて使う
position: absolute;
position: absolute;を使うと、要素同士を重ねて表示することが出来る
サイト全体の左上部分を基準とし、そこからの位置をtopとleftを用いて指定する
position: relative;
基準としたい親要素にposition: relative;と指定すると、その要素の左上部分が基準位置となる
cursor
cursorプロパティを用いることでマウスのカーソルが要素に乗ったときのカーソルの形を変えることができる
:active
セレクタにactiveを用いることで、要素がクリックされている間だけCSSを適用することができる
↧