前言

执笔今天无聊逛站的时候发现一个弹窗的公告，感觉挺不错就给扒下来了，html代码添加起来也很简单，适用于大多数系统。

图片展示

教程开始

如果是子比主题或者是其他什么主题，只要后台有自定义HTMl代码填到里面即可，其他系统请自行测试。

[ttreply]

<div class="web_notice" style="position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.3);z-index: 99999;"><div style="position: fixed;top: 50%;left: 50%;width: 550px;background: #FFF;transform: translate(-50%, -50%);border-radius: 40px;padding: 50px 40px;"><h3 style="font-weight: bold;text-align: center;font-size: 30px;
                ">
                    网站公告
                </h3><br><br><div style="font-size:16px;line-height:30px;color: #999;"><b><font color="#ff0000">
                            欢迎光临执笔博客！
                        </font><br><br><font color="#005aff">
                            站长正常接单中，QQ1628050
                        </font><br><br><font color="#ff0000"><!--永久会员限时588元，年费会员可补差价升级！截止9.1日-->
                            本站所有源码对永久VIP会员提供技术支持，<a href="/vip">点击加入</a></font><br><br><font color="#ff0000"><!--永久会员限时588元，年费会员可补差价升级！截止9.1日-->
                            本站所有资源仅作为学习研究测试，请勿商业使用，否则一切责任与本站无关!
                        </font></b><br></div><a style="display: block;background: #ffb800;color: #FFF;text-align: center;font-weight: bold;font-size: 19px;line-height: 60px;margin: 0 auto;margin-top: 45px;border-radius: 32px;width: 80%;" onclick="javascript:document.querySelector('.web_notice').remove()">
                    我知道了
                </a></div></div>

[/ttreply]

原文地址：给网站添加一个HTML代码弹窗公告 (zbiwl.com)