Lazy loadng

lazy-loaded images using the picture element

by Imri Paloja

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <div class="container">



      <h1>Lazy Loading with Picture Element</h1>

      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the picture element:</p>
      <p>Below are lazy-loaded images using the...

CSS

.container {
  margin-top: 5%;
}

html,body {
  color: #454545;
}