Цитата сообщения ka82 Плееры част?2 (из блогов друзей)

Быстры?просмотр ка?получает? плее? https://webmaster-tools.online/tool/html-code-editor
Любу?картинку сжимае??этот круг ?делает маленько? если он?большая:

#DCDCDC (цвет кружочка ?рамк?плеера) перекрашивае??како?надо по палитр?
<center><p><img alt="" src="АДРЕС_КАРТИНКИ_НАД_ПЛЕЕРО? style="border: 4px solid #DCDCDC; border-radius:100%; box-shadow: 0px 0px 15px #;width: 100px; height: 100px;" /><audio controls="controls" src="АДРЕС_МУЗЫКИ_МР3" style="width: 420px; height: 11px; border-radius: 100px; box-shadow: 0 0 0 3px #DCDCDC; background-color: black;margin:+8px;margin-left:-120px; " title="НАЗВАНИЕ_МУЗЫКИ" type="audio"></audio></p></center>

Прозрачн? рамочк?вокруг плеера ?таки?эффектом:

<table background="" cellpadding="0" cellspacing="0" style="border-radius:6px; box-shadow:inset rgba(0,0,0,1) 0 -1px 11px,inset rgba(252,255,255,.7) 0 8px 15px,rgba(0,0,0,.8) 0 8px 15px -1px;"><tbody><tr><td style="padding: 20px; text-align: center;"><span style="font-family:Georgia;color:#ffffff;font-size:22px;text-shadow: 1px 1px 2px #000000;"><audio controls="controls" loop="loop" src="МУЗЫКА_МР3" style="width:550px; height: 20px; border-radius: 100px; box-shadow: 0 0 0 4px #887659; background-color: brown;" type="audio"></audio></span></td></tr></tbody></table>

Картинка будт?бы эквалайзер, цвет?(эт?коды #......) аналогично перекрашивае?ка?надо палитр?

<div style="width:310px; height:55px; background-image:url(АДРЕС_ИЗОБРАЖЕНИЯ_НАД_ПЛЕЕРО?; height:60px;border-radius:5px;align:left;"><img src="АДРЕС_МИНИ-КАРТИНКИ_НА_ИЗОБРАЖЕНИ? title="НАЗВАНИЕ_КАРТИНКИ" style="width:40px;height:40px; margin-right:270px;" /><audio controls="controls" loop="loop" title="НАЗВАНИЕ_МУЗЫКИ" src="АДРЕС_МУЗЫКИ_МР3" style="width: 290px; height: 6px; border:5px solid #00BFFF; border-radius:25px; background:#00BFFF;box-shadow:inset 0 0 10px #e8203e; padding:30px; background:#1E90FF;box-shadow:inset 0 0 -300px #00BFFF; padding:7px; "></audio> </div>

rotate(10deg) УГОЛ НАКЛОН?(БЫВАЕТ ?ОТРИЦАТЕЛЬНЫ?
transform-origin: left bottom ТОЧК?ОТ КОТОРО?НАКЛОН (left, right, bottom, top)
marquee ДВИЖЕНИЕ
direction=right (НАПРАВЛЕНИ?ДВИЖЕНИЯ (left, right, bottom, top)
scrollamount="1" (СКОРОСТЬ)

<div style="transform:rotate(10deg); transform-origin: left bottom; "><marquee behavior="alternate" direction="right" scrollamount="1"><img src="КАРТИНКА_НАД_ПЛЕЕРО? style="width:100px; height:50px;transform:rotate(-10deg);" /></marquee><video controls="controls" loop="loop" src="АДРЕС_ПЕСН? title="НАЗВАНИЕ_ПЕСН? style="width:300px; border-radius: 100px; box-shadow: 0 0 0 8px #8B0000; background-color: black;" type="audio/mpeg" height="10"></video> </div>

ДАЛЕ?ДВ?ПЛЕЕРА-ТОЧК?ОТКРЫВАЮ?СВОЙСТВО ВОСПРОИЗВЕДЕНИ?РАЗНОЙ СКОРОСТИ!!!!!
Эт?те же плееры, но почему-то, превратившис??точк?из-за крошечного размер? он?приобретаю?тако?свойство :-)
Нажимать на точк? размер?плеера укажит?примерно по 10
Вертикальное ?горизонтальное положени?"точк? плеера можн?изменить вместо этих цифр: margin:+22px;margin-left:-55px
1) Плее?точк??. Фо?(получает? круглы? ме?ет? по цветовой палитр? пока ег?цвет белы?#ffffff


<img alt="lo11 ()" height="" src="ИЗОБРАЖЕНИ?" style="border: 4px solid #ffffff; border-radius:100%; box-shadow: 0px 0px 15px #;width=" /><audio controls="controls" src="АДРЕС_МУЗЫКИ_МР3" style="width: 10px; height: 10px; border-radius: 100px; box-shadow: 0 0 0 2px #d56607; background-color:black;margin:+22px;margin-left:-55px;5px;1px;" title="НАЗВАНИЕ_МУЗЫКИ" type="audio"></audio>

2) Плее?точк??. Если картинка прозрачн?, то он?красив?встане?бе?фона, но цифр?точк?вертикал??горизонтал?искомо?точк?плеера надо поме?ть вместо margin:+28px;margin-left:-44px


<img alt="lo11 ()" height="" src="АДРЕС_КАРТИНКИ " width="80" /><audio controls="controls" src="АДРЕС_МУЗЫКИ_МР3" style="width: 10px; height: 10px; border-radius: 100px; box-shadow: 0 0 0 2px #d56607; background-color:black;margin:+28px;margin-left:-44px;5px;1px;" title="НАЗВАНИЕ_МУЗЫКИ" type="audio"></audio>

Птиц??данном пример?эт?картинка-заглавие
<fieldset style="width:400px;height:355px;padding:10px;border-radius:35px;background-color: #0000FF; border:10px #0000FF solid; padding:15px; margin:5px 0px 0px 5px;box-shadow: inset 0px 0px 25px #000000;"><br /><center><div style="width:350px; height:297px;background-image:url('ФОНОВАЯ_БОЛЬШАЯ_КАРТИНКА');border-radius:20px;box-shadow:0px 0px 8px 8px #000000;"><div style="width:350px; height:0px;border-radius:50px;"><center><div style="width:350px;height:300px;opacity:0.6;border-radius:50px;"><center><p><br /><br /><br /><br /><br /><br /><img alt="" src="КАРТИНКА_В_КРУГЕ_НАД_ПЛЕЕРО? style="border: 4px solid #ff9900; border-radius:100%; box-shadow: 0px 0px 15px #;width: 100px; height: 100px;" /><audio controls="controls" src="АДРЕС_МУЗЫКИ_МР3" style="width: 220px; height: 11px; border-radius: 100px; box-shadow: 0 0 0 3px #ff9900; background-color: black;margin:+8px;margin-left:-120px; " title="НАЗВАНИЕ_МУЗЫКИ" type="audio"></audio></p></center> </div></center></div><img src="АДРЕС_КАРТИНКИ-ЗАГЛАВИЯ" style="width:350px;height:71px;border-radius:30px 30px 0 0;transform:rotate(0deg); margin-left:0px;align:top;padding-left:0px;" /></div></center></fieldset>


Ширина ?высота картинки на плеере: width:144px; height:28px ;
Ширина ?высота полоск?само?полосы плеера: width:132px; margin-left:2px;height: 14px;
Для округлог?плеера здес?ставьт?просто округлую картинку таки?же высоты-ширины, ка??полоса плеера. Либо картинка пойдет по полосе ?по?плее?(ниже полосы проигрывателя)


<div style=" width:344px; height:28px ;background-image:url('АДРЕС_КАРТИНКИ_ПО_ПЛЕЕРУ');"><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ_МР3" style="width:322px; margin-left:12px;height: 14px;margin-top:7px;opacity:0.25;border-radius:10px; " title="НАЗВАНИЕ_МУЗЫКИ"></audio></div>

Кнопка плеера ?обводкой из картинки:


<table background="КАРТИНКА-ОБВОДК? border="0" cellpadding="0" style="width:200px;border-radius:50px;"><tbody><tr><td><center><video alt="" border="0" controls="controls" loop="loop" height="20" src="АДРЕС_МУЗЫКИ_МР3" title="НАЗВАНИЕ_МУЗЫКИ" type="audio/mpeg" width="200"></video></center></td></tr></tbody></table>

Толщин?затемнен? по кр???ег?цвет: 90px #00BFFF
Размытость, толщин??цвет рамк?плеера (?тако?по?дк?: 20px 7px #0000FF
font-size: 30px - эт?цифр?для того, чтоб?опустить ил?поднять плее?br />

<center><table width="318" height="200" background="https://img0.liveinternet.ru/images/attach/c/9/126/726/126726362_sneg.gif" style="border-radius:20px;box-shadow: inset 0px 0px 90px #00BFFF" border="0" cellpadding="0"><tbody><tr><td><center><div style="width:300px; height:55px; height:0px;border-radius:3px;"><center><font style="font-face: arial; font-size: 30px; "><br /></font><video controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ_МР3" style="width:200px; border-radius: 40px; box-shadow:0 0 20px 7px #0000FF;" type="audio/mpeg" height="6" title="НАЗВАНИЕ_МУЗЫКИ"></video></center></div></center></td></tr></tbody></table></center>

Картинки ?рамочках для плееро?ниже сами буду?взяты ?овал либо ?круг, даже если он?прямоугольные

ВА?ТЕКС?

<fieldset style="width:600px;height:600px;border-radius:50%;background-image:url(' КАРТИНКА-ОБОДОК'); border:5px #48D1CC solid; padding:10px; margin:5px 0px 0px 5px;box-shadow:inset 0px 0px 8px 8px rgba(0, 0, 0, 0.61);"><p style="vertical-align: bottom;"><span style="font-family:Georgia,cursive;color:#FF0000;font-weight:bold;font-size:40px;text-shadow:0px 0px 0 rgb(30,213,-42),0px -1px 0 rgb(-2,181,-74),0px -2px 0 rgb(-34,149,-106),0px -3px 0 rgb(-65,118,-137),0px -4px 0 rgb(-97,86,-169),0px -5px 0 rgb(-129,54,-201),0px -6px 0 rgb(-161,22,-233),0px -7px 0 rgb(-193,-10,-265), 0px -8px 0 rgb(-225,-42,-297),0px -9px 8px rgba(0,0,0,1),0px -9px 1px rgba(0,0,0,0.5),0px 0px 8px rgba(0,0,0,.2);"></span></p><center><div style="width:550px;height:498px;background-image:url('КАРТИНКА_ФОНОВАЯ_ВНУТРИ');border-radius:10px ;box-shadow:0px 0px 8px 8px #000000;border-radius:50%;"></div></center><div style="height:40px;width:25px;margin-left:0px;margin-top:-300px;"> <br /><br /><br /><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ_СЛЕВ? title="НАЗВАНИЕ_МУЗЫКИ_СЛЕВ? style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio> </div><div style="height:15px;width:25px;margin-left:350px;margin-top:260px;"> <br /><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ_СНИЗ? title="НАЗВАНИЕ_МУЗЫКИ_СНИЗ? style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio> </div><div style="height:25px;widtn:25px;margin-left:700px;margin-top:-320px;"> <br /><br /><br /><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ_СПРАВА" title="НАЗВАНИЕ_МУЗЫКИ_СПРАВА" style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio> </div><div style="height:30px;width:25px;margin-left:350px;margin-top:-280px;"> <audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ_СВЕРХУ" title="НАЗВАНИЕ_МУЗЫКИ_СВЕРХУ" style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio> <br /> <fieldset style="width:130px;border-radius:30px;background-color: #008000; border:5px #FF0000 solid; padding: 10px; margin:5px 0px 0px 0px;"><span style="font-size:20px;color:#0000FF;"><span style="font-size:20px;color:#FFFF00;">ВА?ТЕКС?</span></span></fieldset></div><p></p></fieldset>

ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?

<fieldset style="width:700px;height:400px;border-radius:50%;background-image:url(' ФОНОВАЯ_КАРТИНКА'); border:5px #48D1CC solid; padding:10px; margin:5px 0px 0px 5px;box-shadow:inset 0px 0px 8px 8px rgba(0, 0, 0, 0.61);"><p style="vertical-align: top;"><span style="font-family:Georgia,cursive;color:#FF0000;font-weight:bold;font-size:40px;text-shadow:0px 0px 0 rgb(30,213,-42),0px -1px 0 rgb(-2,181,-74),0px -2px 0 rgb(-34,149,-106),0px -3px 0 rgb(-65,118,-137),0px -4px 0 rgb(-97,86,-169),0px -5px 0 rgb(-129,54,-201),0px -6px 0 rgb(-161,22,-233),0px -7px 0 rgb(-193,-10,-265), 0px -8px 0 rgb(-225,-42,-297),0px -9px 8px rgba(0,0,0,1),0px -9px 1px rgba(0,0,0,0.5),0px 0px 8px rgba(0,0,0,.2);"></span></p><div style="height:40px;width:25px;margin-left:0px;margin-top:-300px;"> <br /><br /><br /><br /><div style="height:15px;width:25px;margin-left:450px;margin-top:260px;"> <br /><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ1" title="НАЗВАНИЕ_МУЗЫКИ1" style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio> <br /><br /><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ2" title="НАЗВАНИЕ_МУЗЫКИ2" style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio><br /><br /><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫ?" title="НАЗВАНИЕ_МУЗЫКИ3" style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio><br /><br /><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ_4" title="НАЗВАНИЕ_МУЗЫКИ4" style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio></div><fieldset style="width:230px;border-radius:30px;background-color: #008000; border:5px #FF0000 solid; padding: 10px; margin:5px 0px 0px 0px;"><span style="font-size:20px;color:#0000FF;"><span style="font-size:20px;color:#FFFF00;">ВА?ТЕКС? </span></span></fieldset></div><p></p></fieldset>

ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?ВА?ТЕКС?/span>

<fieldset style="width:600px;height:350px;border-radius:50%;background-image:url(' ФОНОВАЯ_КАРТИНКА'); border:5px #48D1CC solid; padding:10px; margin:5px 0px 0px 5px;box-shadow:inset 0px 0px 8px 8px rgba(0, 0, 0, 0.61);"><p style="vertical-align: top;"><span style="font-family:Georgia,cursive;color:#FF0000;font-weight:bold;font-size:40px;text-shadow:0px 0px 0 rgb(30,213,-42),0px -1px 0 rgb(-2,181,-74),0px -2px 0 rgb(-34,149,-106),0px -3px 0 rgb(-65,118,-137),0px -4px 0 rgb(-97,86,-169),0px -5px 0 rgb(-129,54,-201),0px -6px 0 rgb(-161,22,-233),0px -7px 0 rgb(-193,-10,-265), 0px -8px 0 rgb(-225,-42,-297),0px -9px 8px rgba(0,0,0,1),0px -9px 1px rgba(0,0,0,0.5),0px 0px 8px rgba(0,0,0,.2);"></span></p><div style="height:40px;width:25px;margin-left:0px;margin-top:-30px;"> <br /><br /><br /><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ1" title="НАЗВАНИЕ_МУЗЫКИ1" style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ2" title="НАЗВАНИЕ_МУЗЫКИ2" style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ3" title="НАЗВАНИЕ_МУЗЫКИ3" style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio><br /><audio controls="controls" loop="loop" src="АДРЕС_МУЗЫКИ4" title="НАЗВАНИЕ_МУЗЫКИ4" style="width: 200px; height: 13px; border-radius: 100px; box-shadow: 0 0 0 4px #993300; background-color: black;" type=" audio"></audio><br /> <div style="height:15px;width:25px;margin-left:350px;margin-top:20px;"> <br /><br /><fieldset style="width:330px;border-radius:30px;background-color: #008000; border:5px #FF0000 solid; padding: 10px; margin:5px 0px 0px 0px;"><span style="font-size:20px;color:#0000FF;"><span style="font-size:20px;color:#FFFF00;">ВА?ТЕКС?</span></span></fieldset></div></div></fieldset>

Серия сообщени?"Кодировщик":

Шрифты, кнопки ?прочее оформление

Част?1 - Оформление днев?(разные сайт??генераторы)
Част?2 - Дизайн сообщени?днев??принтскрином
...
Част?33 - Урок??советы по компьютеру ?интернет?1(серия сообщени??250 частей)
Част?34 - Вставить музыкальны?плее?/a>
Част?35 - Плееры част?2 (из блогов друзей)