【HTML】loading属性で“lazy”を指定する場合、widthとheight属性が必要
loading属性とは、ブラウザがネイティブで遅延ロードをサポートするというものです。
img要素やiframe要素をHTMLの属性として指定するだけで、JavaScriptを使うことなく、簡単に遅延ロードさせることができます。
例)
<img src="画像パス" loading="lazy" alt="hogehoge">
ところがどっこい、、、
[Intervention] An element was lazyloaded with loading=lazy, but had no dimensions specified. Specifying dimensions improves performance. See https://crbug.com/954323
widthとheight属性も同時に指定しないとChromeに怒られてしまいます。
<img src="画像パス" loading="lazy" alt="hogehoge" width="***" height="***">
widthとheight属性を指定してあげれば問題ありません。
本来、横幅・高さ属性というのはレンダリング計算上、必要なものなので。。
Author And Source
この問題について(【HTML】loading属性で“lazy”を指定する場合、widthとheight属性が必要), 我々は、より多くの情報をここで見つけました https://qiita.com/kingpanda/items/1e0b7d14dc2fdb06fc9a著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .