source | Codingku

Tag <source> digunakan untuk menentukan beberapa sumber file media pada elemen <picture>, <audio> atau <video>

Tag ini memungkinkan kamu untuk menawarkan konten media yang sama dalam berbagai format file untuk memberikan kompatibilitas pada browser yang mendukungnya.

Syntax

Tag <source> ditulis seperti <source src="" type=""> (tanpa tag penutup) dengan URL media yang tercantum diantara tanda kutip ganda dari atribut src`.

Atribut type dapat digunakan untuk menentukan tipe sumber daya media yang membantu browser untuk menentukan apakah dapat memutar file tersebut sebelum mengunduhnya.

Seperti ini:

<audio controls>
	<source src="tune.wma" type="audio/x-ms-wma">
	<source src="tune.mp3" type="audio/mpeg">
</audio>

<picture>
  <source media="(min-width: 800px)" srcset="/images/html/sunset-360.jpg 360w,
    /images/html/sunset-720.jpg 720w,
    /images/html/sunset-1440.jpg 1440w" sizes="33.3vw">
  <source srcset="/images/html/sunset-720.jpg 2x,
    /images/html/sunset-360.jpg 1x">
  <img src="/images/html/sunset.jpg" alt="Picture of a Ha Long Bay sunset">
</picture>

Belajar Element HTML: `<source>`

Syntax

`src`

`"/images/html/tiramisu.jpg"`

`"{{site.url}}/images/html/traffic.jpg"`

`srcset`

`"/images/html/sunset-360.jpg 360w, /images/html/sunset-720.jpg 720w, /images/html/sunset-1440.jpg 1440w"`

`sizes`

`"(min-width: 800px) 1440px, 720px"`

`type`

`"image/jpg"`

`media`

`"(min-width: 800px)"`