Тег SOURCE

  Парный тег SOURCE изначально предназначался для назначения медиафайла элементам тегов AUDIO и VIDEO и мог использоваться только внутри них.
  Несколько элементов тега SOURCE предоставляли браузеру выбор файла - источника аудио или видео, формат хотя бы одного из которых браузер поддерживает.

  С распространением пользовательских устройств с небольшим экраном и соответствующим разрешением, функционал тега SOURCE был расширен.
  Элемент тега SOURCE теперь может указать браузеру, какой файл источника следует выбрать в зависимости от типа окружения Web-страницы.
  И, кроме аудио и видео, элементы тега SOURCE теперь применяются для изображений. Но, поскольку тег IMG является непарным, то для связи элементов тега SOURCE с элементом тега IMG введён специальный тег PICTURE.

  Внутренний контент элемента тега SOURCE никак не отобразится на Web-странице.
  Однако, для своих "дочерних" элементов тегов, тег SOURCE является обычным строчным тегом.
  Атрибуты:
  MEDIA - Устанавливает запрос на тип окружения Web-страницы для воспроизведения или отображения медиафайла.

  • Значение:


  • Значение по умолчанию - all.
  • Атрибут необязательный.
  SIZES - Устанавливает ширину поля просмотра медиафайла.

  • Значение:


  • Значение по умолчанию - Нет.
  • Атрибут не обязательный.
  SRC - Устанавливает адрес медиафайла, который необходимо загрузить.
  Для того, чтобы медиафайл корректно передавался с Web-сервера, на котором он хранится, в конфигураторе Web-сервера должен быть описан MIME тип этого медиафайла.
  Например:
  • AddType audio/mid .mid - В конфигураторе .htaccess сервера Apache.
  • <mimeMap fileExtension = ".mid" mimeType = "audio/mid" /> - В конфигураторе web.config или Windows\System32\inetsrv\config\applicationHost.config сервера Internet Information Server.
  Если формат медиафайла не поддерживается браузером, или MIME тип этого медиафайла не сконфигурирован в браузере, то его нельзя будет прослушать или посмотреть с помощью элемента тега AUDIO, и VIDEO или IMG
  SRCSET - Устанавливает список адресов медиафайлов, один из которых необходимо загрузить и(или) отобразить в зависимости от медиазапроса установленного атрибутом MEDIA.
  Атрибут SRCSET имеет смысл использовать только вместе с атрибутом MEDIA.
  Перекрывает значение атрибута SRC тега AUDIO, атрибута SRC тега VIDEO или SRC тега IMG.
  Атрибут SRCSET поддерживают далеко не все браузеры.
  • Значение:

    • Заключенный в двойные кавычки список интернет-адресов файлов, перечисленных через запятую, для выбора браузером.
        Из этого списка браузер может выбрать файл с поддерживаемым форматом.
        В спецификации допускается после адреса указывать, через пробел, так называемые дескриптор ширины и(или) дескриптор плотности для изображения.

        Дескриптор ширины указывается с обозначением w (width descriptors), и значением равным ширине отображения изображения в пикселях (например 400w).
        Значение дескриптора ширины по умолчанию равно возможному максимуму для среды окружения Web-страницы.

        Дескриптор плотности указывается с обозначением x, и значением равным плотности пикселей отображения изображения (например для повышенного разрешения устройства отображения - 2x).
        Значение дескриптора плотности по умолчанию равно 1.

  • Значение по умолчанию - Нет.
  • Атрибут обязательный если не используется атрибут SRC.
  TYPE - Устанавливает тип медиафайла а также применяемые к нему видео кодек и аудио кодек.

  • Значение в формате -

          TYPE = 'Тип[; codecs = "[Видео кодек, ]Аудио кодек"]'

      Значение состоит из двух частей:

    1. Тип - MIME тип файла.
    2. ; - Ключевое слово.
    3. codecs - Ключевое слово.
    4. Видео кодек - Название видео кодека. Например - vp8.
    5. , - Ключевое слово.
    6. Аудио кодек - Название аудио кодека. Например - vorbis.
      Комбинация одинарных - ' и двойных - " кавычек должна соответствовать формату HTML-кода.

  • Значение по умолчанию - Нет.
  • Атрибут не обязательный.


Пример:
<AUDIO " CONTROLS>
   <SOURCE SRC="../content/Audio.wav">Потанцуем?</SOURCE>
</AUDIO>
Результат: