网站弹窗公告代码，网站html网页弹窗美化下载

网站html网页弹窗美化，网站弹窗公告代码源码下载,适合网站首页公告！复制到您的网站公告栏里面，前提是您的网站公告栏支持HTML代码,内容保存下来用笔记本自行修改

演示效果图：

代码：

<span class="prism-token prism-comment" spellcheck="true">&lt;!-- 弹窗开始  --&gt;</span>
<span class="prism-token prism-tag"><span class="prism-token prism-punctuation">&lt;</span>div <span class="prism-token prism-attr-name">class</span><span class="prism-token prism-attr-value"><span class="prism-token prism-punctuation">=</span><span class="prism-token prism-punctuation">"</span>web_notice<span class="prism-token prism-punctuation">"</span></span><span class="prism-token prism-style-attr language-css"><span class="prism-token prism-attr-name"> style</span><span class="prism-token prism-punctuation">="</span><span class="prism-token prism-attr-value"><span class="prism-token prism-property">position</span><span class="prism-token prism-punctuation">:</span> fixed<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">top</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">0</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">left</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">0</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">width</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">100%</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">height</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">100%</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">background</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-function">rgba</span><span class="prism-token prism-punctuation">(</span><span class="prism-token prism-number">0</span>,<span class="prism-token prism-number">0</span>,<span class="prism-token prism-number">0</span>,<span class="prism-token prism-number">0.3</span><span class="prism-token prism-punctuation">)</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">z-index</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">99999</span><span class="prism-token prism-punctuation">;</span></span><span class="prism-token prism-punctuation">"</span></span><span class="prism-token prism-punctuation">&gt;</span></span>
<span class="prism-token prism-tag"><span class="prism-token prism-punctuation">&lt;</span>div<span class="prism-token prism-style-attr language-css"><span class="prism-token prism-attr-name"> style</span><span class="prism-token prism-punctuation">="</span><span class="prism-token prism-attr-value"><span class="prism-token prism-property">position</span><span class="prism-token prism-punctuation">:</span> fixed<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">top</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">50%</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">left</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">50%</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">width</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">550</span>px<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">background</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-hexcode">#FFF</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">transform</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-function">translate</span><span class="prism-token prism-punctuation">(</span>-<span class="prism-token prism-number">50%</span>, -<span class="prism-token prism-number">50%</span><span class="prism-token prism-punctuation">)</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">border-radius</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">40</span>px<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">padding</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">50</span>px <span class="prism-token prism-number">40</span>px<span class="prism-token prism-punctuation">;</span></span><span class="prism-token prism-punctuation">"</span></span><span class="prism-token prism-punctuation">&gt;</span></span>
<span class="prism-token prism-tag"><span class="prism-token prism-punctuation">&lt;</span>h3 <span class="prism-token prism-attr-name">style</span><span class="prism-token prism-attr-value"><span class="prism-token prism-punctuation">=</span><span class="prism-token prism-punctuation">"</span>font-weight: bold;text-align: center;font-size: 30px;
<span class="prism-token prism-punctuation">"</span></span><span class="prism-token prism-punctuation">&gt;痴痴资源网</span></span><span class="prism-token prism-tag"><span class="prism-token prism-punctuation">&lt;/</span>h3<span class="prism-token prism-punctuation">&gt;</span></span><span class="prism-token prism-tag"><span class="prism-token prism-punctuation">&lt;</span>div <span class="prism-token prism-attr-name">style</span><span class="prism-token prism-attr-value"><span class="prism-token prism-punctuation">=</span><span class="prism-token prism-punctuation">"</span>font-size: 16px;margin-top: 26px;line-height: 30px;color: #999;
<span class="prism-token prism-punctuation">"</span></span><span class="prism-token prism-punctuation">&gt;</span></span>欢迎大家访问痴痴资源网，这里是弹窗代码测试<span class="prism-token prism-tag"><span class="prism-token prism-punctuation">&lt;/</span>div<span class="prism-token prism-punctuation">&gt;</span></span><span class="prism-token prism-tag"><span class="prism-token prism-punctuation">&lt;</span>a<span class="prism-token prism-style-attr language-css"><span class="prism-token prism-attr-name"> style</span><span class="prism-token prism-punctuation">="</span><span class="prism-token prism-attr-value"><span class="prism-token prism-property">display</span><span class="prism-token prism-punctuation">:</span> block<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">background</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-hexcode">#98a3ff</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">color</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-hexcode">#FFF</span><span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">text-align</span><span class="prism-token prism-punctuation">:</span> center<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">font-weight</span><span class="prism-token prism-punctuation">:</span> bold<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">font-size</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">19</span>px<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">line-height</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">60</span>px<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">margin</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">0</span> auto<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">margin-top</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">45</span>px<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">border-radius</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">32</span>px<span class="prism-token prism-punctuation">;</span><span class="prism-token prism-property">width</span><span class="prism-token prism-punctuation">:</span> <span class="prism-token prism-number">80%</span><span class="prism-token prism-punctuation">;</span></span><span class="prism-token prism-punctuation">"</span></span> <span class="prism-token prism-attr-name">onclick</span><span class="prism-token prism-attr-value"><span class="prism-token prism-punctuation">=</span><span class="prism-token prism-punctuation">"</span>javascript:document.querySelector(<span class="prism-token prism-punctuation">'</span>.web_notice<span class="prism-token prism-punctuation">'</span>).remove()<span class="prism-token prism-punctuation">"</span></span><span class="prism-token prism-punctuation">&gt;</span></span>了解&lt;/ a&gt;<span class="prism-token prism-tag"><span class="prism-token prism-punctuation">&lt;/</span>div<span class="prism-token prism-punctuation">&gt;</span></span><span class="prism-token prism-tag"><span class="prism-token prism-punctuation">&lt;/</span>div<span class="prism-token prism-punctuation">&gt;</span></span>
<span class="prism-token prism-comment" spellcheck="true">&lt;!-- 代码完毕  --&gt;</span>