音频音乐滚动文字svg

美化源代码

复制源代码

源代码
<section style="text-align: center;margin:10px 0px;"><section style="background-color:#fbcbce;border-radius:50%;padding:12px 5px 12px;display:inline-block;"><section style="color:#fff;font-size:18px;letter-spacing:2px;"><p style="text-align: center;">                    遇见</p></section><section style="color:#fff;font-size:12px;letter-spacing:2px;"><p style="text-align: center;">                    -MUSIC-</p></section></section><section style="margin-top:-30px;background-color:#ffebea;"><section data-svg-type="6" style="padding:30px 10px 0px;"><svg xmlns="http://www.w3.org/2000/svg" style="width:100%;height:300px;"><text y="80.1647%" x="50%" fill="#383838" style="font-size:15px;text-anchor:middle;box-sizing:border-box;letter-spacing:3px;"><tspan>                            我遇见谁 会有怎样的对白</tspan><animate attributename="y" from="110%" to="0" begin="0.6s" dur="8s" repeatcount="indefinite"></animate></text><text y="90.4524%" x="50%" fill="#383838" style="font-size:15px;text-anchor:middle;box-sizing:border-box;letter-spacing:3px;"><tspan>                            我等的人 他在多远的未来</tspan><animate attributename="y" from="120%" to="0" begin="0.8s" dur="8s" repeatcount="indefinite"></animate></text><text y="101.24%" x="50%" fill="#383838" style="font-size:15px;text-anchor:middle;box-sizing:border-box;letter-spacing:3px;"><tspan>                            我听见风来自地铁和人海</tspan><animate attributename="y" from="130%" to="0" begin="1s" dur="8s" repeatcount="indefinite"></animate></text><text y="112.528%" x="50%" fill="#383838" style="font-size:15px;text-anchor:middle;box-sizing:border-box;letter-spacing:3px;"><tspan>                            我排着队 拿着爱的号码牌</tspan><animate attributename="y" from="140%" to="0" begin="1.2s" dur="8s" repeatcount="indefinite"></animate></text></svg></section><section style="padding:5px 10px 10px;"><section style="background-color:#f7f7f7;border-radius:7px;"><p style="padding:13px 13px 13px;color: #222; font-size: 14px; letter-spacing: 2px; text-align: left;">                        选中文字可替换音乐，选中文字可替换音乐，选中文字可替换音乐，选中文字可替换音乐，选中文字可替换音乐，</p></section></section></section></section>

可视化

遇见

-MUSIC-

选中文字可替换音乐，选中文字可替换音乐，选中文字可替换音乐，选中文字可替换音乐，选中文字可替换音乐，

专注移动端开发

快速链接

关于我们

115cms信息内容管理系统