Tailwind CSS実践入門を読んで、備忘録。
Tailwindでできることが何となく分かる。
ガッツリ読むのではなく、あっさり読んだ。
自分の理解度の立ち位置がわかるので、やっぱり改めて教材で学習するのはいいね。
こちらで手を動かしたり、メモしたりしてます
４章の基本的なユーティリティは普通にCSSの勉強にもなった。
７章 Tailwind CSSのカスタマイズ
８章 Tailwind CSSを既存のプロジェクトに導入
９章 デザインシステムとTailwind
については、流す程度に。頭の片隅に入れておきます。
以下、軽い学びをメモに
- isolation: z-indexの独立
- mixblendmode: plus-lighter 画像の切り替えのスムーズに
- will-change アニメーションをcpuでなく高速処理のgpuにさせる
- scroll-margin アンカーリンクの移動位置を調整
- focusクリックとタブ focus-within 親要素に focus-visible タブのみ推測
- <img><video>はインライン要素にも関わらずwidth heightを指定できる。「置換要素」という。（tailiwindのpreflightはdisplay:blockになっている）