2024年 2月
CSSメモメモ
1..container では
display: grid;
2.最初は小さい画面から作成する。
その後で大きい画面
@media screen and (min-width: 376px)
376->600くらいの方がいい
3.ブロックのセンタリングは
margin: 0 auto;
4.サイズ指定は%で指定する
width: 31.2%;
5.画像の高さは横幅で拡縮
height: auto;
6.均等配置は
justify-content: space-between;
7.ハイパーリンクの心得
color: inherit;
text-decoration: none;
8.ul で横並び
display: flex;
list-style-type: none;
justify-content: space-between;
9.grid チップス 繰り返すこともできる
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: repeat(3, 22px);
gap: 5px;
10.子要素の配置 grid バージョン
display: grid;
place-items: center; <-start center | center end などなど
11.子要素の配置 flex バージョン
display: flex;
justify-content: left | center | right; <- どれか
align-items: start | center | end; <- どれか