エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
記事へのコメント1件
- 注目コメント
- 新着コメント
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
picture要素で使うsourceタグにもwidthとheight属性を書くといいらしい
突然ですが、picture要素を使ってアスペクト比が違う画像を読み込む場合でも、imgとsourceにwidthとheig... 突然ですが、picture要素を使ってアスペクト比が違う画像を読み込む場合でも、imgとsourceにwidthとheightを記述すれば、レイアウトシフトが起こらなくなるって知ってました? <picture> <source srcset="img/img-800x480px.jpg" media="(min-width: 820px)" width="800" height="480"> <img src="img/img-480x480px.jpg" width="480" height="480" alt="画像の説明"> </picture> 実は1年以上前に公開されたChrome 90からサポートされていたそうで(僕はつい先日知りました)、上のコードのようにimgとsourceの両方にwidthとheightを記述すれば、ブラウザがそれらの値を認識して画像ファイルを読み込む前か
2022/07/22 リンク