边框代码学习【黄梅戏，海滩别】马兰 白燕升唱
<style type="text/css">
.mnBox {
margin: 0 auto;
padding: 35px;
width: 660px;
border: none;
border-top: 6px solid #000;/* 顶部边框样式*/
border-radius: 10px;
background: #0000FF;
}
.ctBox {
margin: 0;
padding: 10px;
background: #87CEEB;
min-height: 300px;
border-radius: 10px;
box-shadow: 1px 3px 2px 2px rgba(4,4,4,.6);
}
.ctBox p,img, h2,button { text-align:center; }
.picBtn {
width: 32px;
height: 32px;
outline: none;
border: none;
border-radius: 8px;
background: transparent url('https://pic.imgdb.cn/item/61e446952ab3f51d917b0f77.png') no-repeat;
cursor: pointer;
box-shadow: 1px 1px 2px 1px rgba(0,0,0,.25);
}
.picBtn:hover {
opacity: 0.95;
box-shadow: 1px 1px 2px 2px rgba(0,0,0,.3);
}
.picBtn:active {
opacity: 0.8;
box-shadow: 1px 1px 1px 0px rgba(0,0,0,.5);
}
</style>
<div class="mnBox">
<div class="ctBox">
<p><img style="padding-top: 30px; alt="" src="https://pic.imgdb.cn/item/668b95b2d9c307b7e9a4a04d.jpg" /></p>
<h2 style="text-align:center;">海滩别 (黄梅戏)</h2>
<h2 style="text-align:center;">马兰白燕升</h2>
<pre>
女：本愿与你长相守
同偕到老忘忧愁
孤独的滋味早尝够
萍踪浪迹几度秋
怎舍两分手
叫你为我两鬓添霜又白头
男：你我久别方聚首
怎教离愁别恨，放下眉尖，又上心头
可知道那海水何红红似姻脂酒
女：那是你点点血泪和海水日夜流
男：可知道那海涛因何似泣如诉
女：那是你轻轻呼唤，伴着海风声悠悠
男：失去你我如像风筝断线随风走
女：失去你我好像离巢孤雁落荒丘
男：没有你谁与我来共欢乐
女：没有你谁来和我分忧愁
男女合唱：莫叫相思寄红豆，形影相随情更愁
</pre>
<p><audio id="music" src="https://music.163.com/song/media/outer/url?id=1859212056.mp3" loop="loop" autoplay="autoplay" ></audio><br> </p>
<p><button id="picBtn" class="picBtn"></button></p><br>
<p>梦江南 2024.7.8</p><br><br>
</div>
</div>
<script language="javascript">
var mu = document.getElementById('music');
var btn = document.getElementById('picBtn');
btn.onclick = function(){
mu.paused ? (mu.play(), btn.style.background="url('https://pic.imgdb.cn/item/61e446952ab3f51d917b0f77.png')") : (mu.pause(), btn.style.background="url('https://pic.imgdb.cn/item/668b93ccd9c307b7e9a1cd5e.jpg')");
}
mu.addEventListener("ended", function(){
btn.style.background="url('https://pic.imgdb.cn/item/62ab61e56103f51d9145d37c.png')";
})
</script> 好看又好听，梦江南真是做什么都不错呢，很赞{:4_199:} 这边框这角倒的好，像我做模具倒的角一样好{:4_205:} 红影 发表于 2024-7-8 20:53
好看又好听，梦江南真是做什么都不错呢，很赞
早上问好影子，谢谢分享鼓励！ 辫子哥哥 发表于 2024-7-8 21:29
这边框这角倒的好，像我做模具倒的角一样好
辫子老师是开模具的师傅？谢谢分享支持！早上好！ 欣赏佳作，点赞！
老谟深虑 发表于 2024-7-9 15:27
欣赏佳作，点赞！
谢谢老谟老师分享，问好！ 梦江南 发表于 2024-7-9 07:21
早上问好影子，谢谢分享鼓励！
不客气啊，问好梦江南，晚上好{:4_187:} 红影 发表于 2024-7-9 22:06
不客气啊，问好梦江南，晚上好
问好影子，上午好！ 梦江南 发表于 2024-7-10 09:15
问好影子，上午好！
继续来听黄梅戏{:4_187:} 红影 发表于 2024-7-10 13:29
继续来听黄梅戏
我也在听马兰，白燕升唱别海滩。蛮好听。下午好！{:4_187:} 梦江南 发表于 2024-7-10 13:36
我也在听马兰，白燕升唱别海滩。蛮好听。下午好！
感觉你应该喜欢越剧啊，咋也喜欢黄梅戏{:4_173:} 红影 发表于 2024-7-10 13:55
感觉你应该喜欢越剧啊，咋也喜欢黄梅戏
越剧是喜欢听，黄梅戏也喜欢听的。 梦江南 发表于 2024-7-9 07:24
辫子老师是开模具的师傅？谢谢分享支持！早上好！
嗯！模具你也懂？{:4_187:} 梦江南 发表于 2024-7-10 13:57
越剧是喜欢听，黄梅戏也喜欢听的。
是的，这些都挺好听的，还有苏州评弹也不错。
页:
[1]