b2主题美化-两款弹窗公告美化

Jaysun

温馨提示:这篇文章已超过475天没有更新,请注意相关的内容是否还可用!

公告网站必不可少,今天分享两款公告样式,一款简约公告,朴素大方,比较干净,一款比较实用,大家可以根据自己实际的需求实用。

效果图:

1.png

CSS代码

隐藏内容
评论可见
前往评论


放入主题的style.css文件中,或自行引入。


效果图二

2.webp.jpg

Css代码:


<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;">网站通知
            <div style="
		font-size: 16px;
		margin-top: 26px;
		line-height: 30px;
		color: #999;">我是通知的内容,您好...</div>
            <a style="
		display: block;
		background: #98a3ff;
		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>





您需要 登录账户 后才能发表评论

发表评论

快捷回复: 表情:
AddoilApplauseBadlaughBombCoffeeFabulousFacepalmFecesFrownHeyhaInsidiousKeepFightingNoProbPigHeadShockedSinistersmileSlapSocialSweatTolaughWatermelonWittyWowYeahYellowdog
评论列表 (有 21 条评论,1339人围观)
网友昵称:dfw001
dfw001 V 普通用户 Google Chrome 114.0.5735.289 Windows 10 x64 20楼
2023-10-16 来自山西 回复
文章不错,写的很好!
网友昵称:dubuyuxia
dubuyuxia V 普通用户 Google Chrome 95.0.4638.69 Windows 10 x64 19楼
2023-09-21 来自辽宁 回复
文章不错,写的很好!
网友昵称:3398921314
3398921314 V 普通用户 Google Chrome 116.0.0.0 Windows 10 x64 18楼
2023-09-17 来自天津 回复
赞、狂赞、超赞、不得不赞、史上最赞!
网友昵称:tan
tan V 普通用户 Google Chrome 94.0.4606.71 Windows 10 x64 17楼
2023-09-11 来自广东 回复
范德萨发生的发生
网友昵称:dreamxiaojia
dreamxiaojia V 普通用户 Google Chrome 114.0.0.0 Windows 10 x64 16楼
2023-06-16 来自陕西 回复
赞、狂赞、超赞、不得不赞、史上最赞!
网友昵称:982214
982214 V 普通用户 Safari 15.3 Apple iPhone 15楼
2023-04-27 来自湖南 回复
牛逼666666
网友昵称:离雨1
离雨1 V 普通用户 Google Chrome 101.0.4951.64 Windows 7 x64 14楼
2023-04-15 来自福建 回复
感谢分享
网友昵称:倾国倾城
倾国倾城 V 普通用户 Google Chrome 108.0.5359.95 Windows 7 x64 13楼
2023-04-11 来自广东 回复
感谢分享
网友昵称:kindemon
kindemon V 普通用户 Firefox 111.0 Windows 10 x64 12楼
2023-04-04 来自广东 回复
赞、狂赞、超赞、不得不赞、史上最赞!
网友昵称:xiaobai
xiaobai V 普通用户 Google Chrome 111.0.0.0 Windows 10 x64 11楼
2023-04-01 来自山西 回复
看一下= 学习

目录[+]

取消
微信二维码
微信二维码
支付宝二维码