表格样式排名情况喜报序号正文大标题

美化源代码
复制源代码
源代码
<section style="margin:10px 0px;text-align:center;"><section style="background-color:#f64431;padding:10px 10px;"><section style="display:flex;justify-content:center;align-items:center;margin:0px 0px;"><section style="border:solid 1px #ffe9e6;width:70px;height:70px;border-radius:50%;"><section style="font-size:49px;color:#ffe9e6;line-height:66px;"><p style="text-align:center;"><strong>喜</strong></p></section></section><section style="margin-left:-7px;"><section style="border:solid 1px #ffe9e6;width:70px;height:70px;border-radius:50%;"><section style="font-size:49px;color:#ffe9e6;line-height:66px;"><p style="text-align:center;"><strong>报</strong></p></section></section></section></section><section style="margin-top:-48px;"><section style="background-color:#fefefe;display:inline-block;padding:0px 15px;"><section style="color:#ff2f1f;letter-spacing:2px;font-size:15px;"><p>庆祝公司业绩再创新高</p></section></section></section><section style="margin:30px 0px 0px;"><section style="display:flex;justify-content:center;align-items:center;margin:0px 0px;"><section style="width:33%;"><section style="color:#ffefdd;letter-spacing:2px;font-size:17px;"><p>排名</p></section></section><section style="width:33%;"><section style="color:#ffefdd;letter-spacing:2px;font-size:17px;"><p>姓名</p></section></section><section style="width:33%;"><section style="color:#ffefdd;letter-spacing:2px;font-size:17px;"><p>成绩</p></section></section></section></section><section style="margin:10px 0px 0px;"><section style="background-color:#ffefdd;border-radius:5px;padding:4px 0px;"><section style="display:flex;justify-content:center;align-items:center;margin:0px 0px;"><section style="width:33%;"><section style="color:#ff3a1f;letter-spacing:2px;font-size:15px;"><p>NO.1</p></section></section><section style="width:33%;"><section style="color:#ff3a1f;letter-spacing:2px;font-size:15px;"><p>刘聪聪</p></section></section><section style="width:33%;"><section style="color:#ff3a1f;letter-spacing:2px;font-size:15px;"><p>680</p></section></section></section></section></section><section style="margin:10px 0px 0px;"><section style="background-color:#ffefdd;border-radius:5px;padding:4px 0px;"><section style="display:flex;justify-content:center;align-items:center;margin:0px 0px;"><section style="width:33%;"><section style="color:#ff3a1f;letter-spacing:2px;font-size:15px;"><p>NO.2</p></section></section><section style="width:33%;"><section style="color:#ff3a1f;letter-spacing:2px;font-size:15px;"><p>刘聪聪</p></section></section><section style="width:33%;"><section style="color:#ff3a1f;letter-spacing:2px;font-size:15px;"><p>680</p></section></section></section></section></section><section style="margin:10px 0px 0px;"><section style="background-color:#ffefdd;border-radius:5px;padding:4px 0px;"><section style="display:flex;justify-content:center;align-items:center;margin:0px 0px;"><section style="width:33%;"><section style="color:#ff3a1f;letter-spacing:2px;font-size:15px;"><p>NO.3</p></section></section><section style="width:33%;"><section style="color:#ff3a1f;letter-spacing:2px;font-size:15px;"><p>刘聪聪</p></section></section><section style="width:33%;"><section style="color:#ff3a1f;letter-spacing:2px;font-size:15px;"><p>680</p></section></section></section></section></section></section></section>
可视化
喜
报
庆祝公司业绩再创新高
排名
姓名
成绩
NO.1
刘聪聪
680
NO.2
刘聪聪
680
NO.3
刘聪聪
680
表格样式排名情况喜报序号正文大标题

专注移动端开发

快速链接

关于我们

115cms信息内容管理系统
