Picture Element & Srcset

Farklı ekran boyutları ve yoğunlukları için uygun resim seçimi.

Responsive resimler <picture> ve srcset ile sunulur.

Tarayıcı uygun kaynağı otomatik seçer.

Responsive Image with Picture

<picture>
  <source media="(min-width: 800px)" srcset="large.jpg" />
  <source media="(min-width: 400px)" srcset="medium.jpg" />
  <img src="small.jpg" alt="Örnek Görsel" />
</picture>

Img with Srcset

<img src="small.jpg"
     srcset="small.jpg 480w, medium.jpg 800w, large.jpg 1200w"
     sizes="(max-width: 600px) 480px, (max-width: 900px) 800px, 1200px"
     alt="Responsive Görsel" />