ویژگی srcset <source> در HTML

برچسب <source> HTML

تعریف و استفاده

srcset ویژگی URL تصاویر مورد استفاده در شرایط مختلف را مشخص می‌کند.

وقتی که از <source> استفاده می‌شود <picture> در این حالت، این ویژگی ضروری است.

مثال

یک عناصر <picture> شامل دو فایل منبع و یک تصویر پشتیبان:

<picture>
  <source media="(min-width:650px)" srcset="img_pink_flowers.jpg">
  <source media="(min-width:465px)" srcset="img_white_flower.jpg">
  <img src="img_orange_flowers.jpg" alt="Flowers" style="width:auto;">
</picture>

آزمایش کنید

نحوه استفاده

<source srcset="URL">

مقدار ویژگی

مقدار توضیح
URL

URL تصویر تعیین می‌کند.

ممکنه‌ها:

  • URL‌های مطلق - به وب‌سایت دیگری اشاره دارد (مثلاً href="http://www.example.com/flower.jpg")
  • URL‌های نسبی - به فایل‌های داخل وب‌سایت اشاره دارد (مثلاً href="flower.jpg")

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولین مرورگری است که این ویژگی را پشتیبانی می‌کند.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
38.0 13.0 38.0 9.1 25.0

برچسب <source> HTML