Thuộc tính srcset của thẻ <source> trong HTML

Thẻ <source> HTML

Định nghĩa và cách sử dụng

srcset Thuộc tính này quy định URL của hình ảnh được sử dụng trong các tình huống khác nhau.

Khi sử dụng thuộc tính <source> cho <picture> Khi này, thuộc tính này là bắt buộc.

Mô hình

Một yếu tố <picture> chứa hai tệp nguồn và một hình ảnh dự phòng:

<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>

Thử ngay

Cú pháp

<source srcset="URL">

Giá trị thuộc tính

Giá trị Mô tả
URL

Định nghĩa URL của hình ảnh.

Giá trị có thể:

  • URL tuyệt đối - Chỉ đường đến một trang web khác (ví dụ href="http://www.example.com/flower.jpg")
  • URL tương đối - Chỉ đường đến tệp trong trang web (ví dụ href="flower.jpg")

Hỗ trợ trình duyệt

Số trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ thuộc tính này hoàn toàn.

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

Thẻ <source> HTML