I'm using an image for div background image and lighthouse warning me for deferring offscreen image. This is my code and Is anyone can say, how can I defer this image with this code?

<div class="page-info hasOverly" style="background: url([@url]app/images/bg2.webp); background-size:cover">

Note: [@url] is my website domain address. And say how can I use CSS for 'lazyloaded' and 'lazyloading' that explained in (https://web.dev/codelab-use-lazysizes-to-lazyload-images/)