子比主题美化 – 页面左下角添加欢迎光临提示框

简介

在网站页面左下角添加一个带有铃铛图标的“欢迎光临”胶囊提示框，提升用户体验与站点亲和力。

功能特点：

• 位置固定：页面左下角悬浮显示
• 铃铛图标：自带摆动动画效果
• 一键关闭：点击右上角X可关闭，带平滑移除动画
• 深色模式自适应：自动适配子比主题深/浅色模式
• 移动端隐藏：手机访问自动不显示

效果图

教程开始

这个代码可以分开放入保存也可以在一起合并保存，自己选择一种添加即可

分开添加

将下面代码放入css代码

将下面代码放入自定义JavaScript代码

将下面代码放入自定义底部HTML

其中svg标签可以自行替换其他图标，可以去阿里巴巴矢量图标库中寻找图标。可以添加svg图标也可以下载后img标签引入svg文件。也可以直接采用图标库，例如fa图标库。或者图片也是可以的