На сегодняшний день коды работающие. Ссылку не записала, когда гуглила, искала работающие коды. Дряни много, поэтому ссылки не брала.
----------------------------------------------------------------------------------------------------------
Добрый день! Приятно, что на ЛиРу всё больше и больше людей, которые не хотят ждать милостей от природы или других людей, а берут быка за рога сами: лезут в исходный код страницы и т.д. Для остальных, менее любознательных, просто опубликую HTML5 "коды" основных плееров. Очень кратко, на вопросы отвечать не буду. Сразу скажу, что коды могут быть не обязательно вот прямо точь в точь такими. Если интересны подробности, почитайте в учебниках или справочниках по HTML5 про теги "audio" и "video".

Аудиоплеер


Видеооплеер

Параметр "poster" может отсутствовать. Ширина и высота указывается в пикселях.

Музыкальная открытка
По сути это - видеоплеер, но с аудиофайлом:

Совет. Чтобы кнопки управления воспроизведением не закрывали картинку, рекомендую добавить внизу картинку что-то примерно на 30 пикселей.

- этот меня устраивает.
Но! При ширине 15 пикселей зачем у радиуса 60 рх? Толи ему (радиусу) ещё какую-то невидимую фигню закруглять надо. Ведь по-сути закруглить нужно края ширины 15-ти пикселей. Меняю на 15рх

Ну и как? А вот если изменяю ширину плеера на 60рх в соответствии с размером радиуса 60рх. Больше в коде ничего не меняла. Получается результат:

-----------------------------------------------------------------------------------------------------
Здесь убрала - background-color: black;

Здесь убрала - #000000;

Потому что это обозначение цвета обводки. А зачем двойное обозначение? Это перегрузка кода!
Результат один. Или то или другое - на выбор
----------------------------------------------------------------------------------------------------
Здесь я убрала тень и её цвет. Радиус поставила 25рх, как ширина плеера.

----------------------------------------------------------------------------------------------------
Я не учу и не поучаю. Думаю, ищу правильность и простоту.
Свои плееры я выложу в подходящих постах. Урок писать не буду.

А ещё именно у этого плеера при подволке к нему стрелку мышки на включение - становится видным назвиние мелодии и исполнитель.
В других кодах плееров нет этого.

Это цитата сообщения Rost Оригинальное сообщение

ЯблочкоНаливное

ЯблочкоНаливное

ЯблочкоНаливное

ЯблочкоНаливное

ЯблочкоНаливное

ЯблочкоНаливное

Глубокая терапия сна Лечение бессонницы Спать спокойно