ZH
PortuguêsEnglishEspañolDeutschFrançaisItaliano日本語Русский中文
首页 收藏
Voltar

网站公告栏(顶部横幅)

写下公告内容,放上链接并选择颜色。关闭横幅的人不会再次看到它,横幅也可以在你设定的日期之后自动消失。

使用方法

网站顶部的公告横幅


可用语言: PortuguêsEspañolEnglishDeutschFrançaisItaliano日本語Русский中文

下一个工具网站步骤条(HTML 和 CSS 步骤指示器)→
广告

网站公告栏(顶部横幅): 用途

网站顶部的横幅是通知促销、包邮、节假日特别营业时间或新消息的最简单方式,不会妨碍浏览。

写下公告内容和链接,并选择颜色。代码会记住已关闭的用户,不再重复显示(直到你修改文字),可以在某个日期后自动消失,也可以在滚动时固定。横幅放在页面开头,从加载起就占好位置,避免挤动内容而影响 CLS。

使用方法

  1. 写下文字和链接。
  2. 选择颜色、关闭按钮和结束日期。
  3. 复制并粘贴到 body 标签之后。

使用场景

  • 双十一促销。
  • 节假日营业时间通知。
  • 包邮或优惠券。

常见问题

横幅怎么记住用户已经关闭了?

代码会通过 localStorage 记录该公告已被关闭。如果你修改了文字,键值也会随之改变,新的公告会再次向所有人显示。

横幅会影响 SEO 或加载速度吗?

不会,它是轻量的 HTML 和 CSS。为了避免页面加载后被挤动(这会使 Google 的 CLS 指标变差),代码会把横幅放在 body 开头,从一开始就占好位置,只有在用户已经关闭时才会移除。

可以只显示到某个日期吗?

可以。填写结束日期,横幅在这之后就不再显示,不需要你再进入网站去撤下。

真的免费吗?

是的,100%免费。无需注册,无需订阅,不限使用次数。所有工具:Tools123是免费的。

相似工具

非常感谢您的支持!

每一笔捐赠都有助于维持网站运行。这些工具旨在帮助您,但我们有服务器开销。如果您愿意支持,将不胜感激!请选择或输入金额:

通过Stripe安全支付。将在新标签页打开。

工具按现状提供,不作任何保证。我们不对结果及其使用承担责任。