Η ιδιότητα srcset του HTML <source>

HTML <source> ετικέτα

Ορισμός και χρήση

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

HTML <source> ετικέτα