たまに使うcssのデモページ
【grid】subgridについて
grid-template-rows: subgrid;
-
タイトル
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
link -
タイトル
link -
タイトル
テキストが入ります。テキストが入ります。テキストが入ります。
link
grid-template-columns: subgrid;
-
タイトル
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
link -
長いタイトル
link -
タイトル
テキストが入ります。テキストが入ります。テキストが入ります。
link
【grid】auto-fillとauto-fitについて
画面幅769px以上ではminmax(100px, 1fr)、それ以下では minmax(60px, 1fr)
auto-fill
最小値が確保できる分だけ余白（空き）ができる。
- A
- B
- C
- D
- E
auto-fit
余白（空き）があれば埋めるように大きくなる。
- A
- B
- C
- D
- E
filterとbackdrop-filter
filter: blur(10px);
pそのものがぼやける（わかりやすいようにpに背景色をつけました）
テキストもぼやける
backdrop-filter: blur(10px);
pの背景がぼやける
文字自体はぼやけない