موزیک پلیر 4
سلام
موزیک پلیر جدید لطفا تا می تونید ازش استفاده کنید >_< ایده داشته باشم تند تند موزیک پلیرهای جدید می ذارم براتون ،_،
آموزش گذاشتن موزیک پلیر رو از اینجا میتونین ببینین و لطفا لینک سازنده رو برندارید 3>
<div class="flex-container" style="display: flex; flex-direction: column; max-height: 400px; overflow: hidden;max-width: 430px; margin: 0 auto;">
<div class="top-container" style="display: flex;">
<div class="right-box" style="flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: #text_box_color;">
<div class="text" style="text-align: left;">
<div style="line-height: 10px; font-family: 'Open Sans', sans-serif;font-size: 14px;font-weight: bold; text-transform: uppercase; color: black; cursor: default;">The Noisy Freaks</div>
<div style="line-height: 20px; color: #636367; font-family: 'Open Sans', sans-serif; font-size: 10px; font-weight: bold; cursor: default;">Premiere</div>
<div style="font-family: 'Open Sans', sans-serif; font-size: 11px; color: black; cursor: default;line-height: 30px;">I Need You Back</div>
<div style="color: #636367; font-family: 'Open Sans', sans-serif; font-size: 12px; cursor: default;"><a style="text-decoration: none; font-size: 8px; background-color: white; color: black; padding: 0.3vw;" href="https://magic-spirit.blog.ir/">Magic Spirit</a></div>
</div>
</div>
<div class="left-box" style="flex: 1; display: flex; align-items: center; justify-content: center; position: relative;">
<!-- Creative border inside the image -->
<div style="position: absolute; width: calc(100% - 30px); height: calc(100% - 30px); border: 1px solid #border_color; box-sizing: border-box; border-radius: 5px;"></div>
<img src="#your_image_link" alt="Image" style="max-width: 100%; max-height: 300px; object-fit: cover; object-position: center; border-radius: 5px;">
</div>
</div>
<div class="audio-box" style="background-color: #below_box_color; padding: 9px; text-align: center; margin: 0 auto; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px;">
<audio controls style="height: 20px; opacity: 0.9;">
<source src="#your_song_link" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</div>
</div>
text_box_color همون رنگ باکسی هست که اسم آهنگ رو توش می نویسید.
border_color رنگ حاشیه دور عکس هست.
below_box_color رنگ باکس پایینی پشت موزیک پلیر هست.
مینامی سان یه همچین قالبیم میتونی درست کنی؟:<