Вбудовування аудіо

Ви можете використовувати елемент <audio>, щоб додати аудіофайли на вебсторінку. Розглянемо приклад:

У цьому прикладі:

• Елемент <audio> містить елемент <source>, який вказує URL-адресу та тип файлу аудіо. Поширені підтримувані формати — MP3 та OGG;

• Атрибут controls відображає стандартні елементи керування відтворенням, такі як відтворення, пауза та гучність;

• Якщо браузер користувача не підтримує елемент audio, буде показано резервне повідомлення.

Додаткові атрибути, які часто використовуються з елементом HTML audio:

• autoplay: відтворює аудіофайл одразу після завантаження сторінки;

• loop: забезпечує безперервне повторення аудіофайлу;

• muted: вимикає звук аудіо за замовчуванням;

• volume: визначає початковий рівень гучності для аудіофайлу, у діапазоні від 0.0 (без звуку) до 1.0 (максимальна гучність).

Приклад, що демонструє використання всіх цих атрибутів:

Вбудовування відео

Ви можете вбудовувати відеофайли на веб-сторінку за допомогою елемента <video>. Розгляньте наступний приклад:

У цьому прикладі:

• Елемент <video> містить елемент <source>, який вказує URL-адресу та тип файлу відео. Поширені підтримувані формати: WebM, MP4 та OGG;

• Атрибут controls відображає стандартні елементи керування відтворенням;

• Якщо браузер користувача не підтримує елемент video, буде показано резервне повідомлення.

Поширені атрибути для елемента HTML video включають:

• autoplay: автоматичний запуск відеофайлу при завантаженні сторінки;

• loop: безперервне повторення відеофайлу;

• muted: вимкнення звуку за замовчуванням;

• volume: визначає рівень гучності для аудіофайлу за замовчуванням, у діапазоні від 0.0 (без звуку) до 1.0 (максимальна гучність);

• poster: вказує URL зображення, яке відображається як мініатюра відео до початку відтворення;

• width та height: визначають ширину та висоту відеоплеєра у пікселях.

Ось приклад, що демонструє використання всіх цих атрибутів:

Примітка

Додатково існує багато JavaScript-бібліотек та API, які надають розширені можливості для відтворення та керування відеоконтентом у вебі.