Кадом тег HTML кӯмак мекунад, ки тасвирҳои гуногун барои ҳалли гуногуни экран бор карда шаванд?

Дар HTML истифодаи теги <picture> барои бор кардани тасвирҳои гуногун вобаста ба ҳалли экран истифода мешавад. Дар дохили он метавон чанд <source> бо хосияти media нишон дод, ки шароитҳоро барои интихоби тасвир муайян мекунад, ва теги <img> бо тасвири захира.

Масалан:

<picture>
  <source media="(min-width: 800px)" srcset="large.jpg">
  <source media="(min-width: 400px)" srcset="medium.jpg">
  <img src="small.jpg" alt="Масали тасвир">
</picture>

Дар ин мисол, браузер large.jpg-ро интихоб мекунад агар паҳнои экран 800px ё бештар бошад, medium.jpg барои паҳнои аз 400px то 799px, ва small.jpg барои экранҳои хурд.

Ҳамчунин, барои ҳолатҳои оддӣ, метавон атрибути srcset-ро дар теги <img> истифода бурд, ки тасвирҳои гуногунро бо андозаҳои онҳо нишон медиҳад.