Emlog添加顶部动态彩条教程

  • 内容
  • 相关
给Emlog博客网站顶部添加一个彩色横条,样式预览请看下图↓

思路:在网站顶部添加一个Div层,将其定位并且始终固定在浏览器顶部,随着页面而移动,并且始终在最顶层,不会被遮挡。缺陷:需要添加Div层,比较麻烦。优点:所有主题都适用,效果更佳。

首先,我们需要动态彩条gif图片,当然你有喜欢的gif彩条也可以替换,下面直接提供彩条原文件,喜欢的自己保存到空间用自己网站外链效果更佳,替换下方gif图片地址,嫌麻烦直接用我发的。
HTB1CqMqdGWs3KVjSZFx5jaWUXXaA.gif

添加彩条教程:

height不要改动,因为图片的高度为4px;

top为外围距离顶部高度,自行调整。如果你的Div并没有出现距离问题,就不需要。

Position这里定义的是固定。如果不需要就删除这行。

Width宽度,如果添加后宽度有异常,请调整这一项。

Z-index这是层数,越高,也就在其他模块之上。

然后在header.php最下面的 </nav>
前面添加以下代码
该内容已被管理员隐藏 您需要回复后并刷新才可以查看
 
如果你觉得雨滴资源网对你有帮助的话,可以小小的打赏一下小站,用于维持本站的运营!

本文标签:

版权声明:雨滴资源网内容来源于互联网,如果有侵权内容、不妥之处,请第一时间联系我们删除。敬请谅解!

本文链接:Emlog添加顶部动态彩条教程 - https://www.yudzy.com/881.html

失效提示:此文更新于2019-9-24,如果文章内容或图片资源失效,请留言反馈,客服会及时处理,谢谢!

发表评论

评论

27条评论
  1. avatar

    山治. Lv.3 Sogou Explorer Sogou Explorer Windows Windows 回复

    感谢分享

    山东省 移动

    1. avatar

        Lv.3 Chrome 70.0.3538.25 Chrome 70.0.3538.25 Windows 7 x64 Edition Windows 7 x64 Edition 回复

      支持66666666呜呜呜呜

      广东省中山市 电信

      1. avatar

        XY Lv.1 Chrome 57.0.2987.108 Chrome 57.0.2987.108 Windows Server 2003 Windows Server 2003 回复

        谢谢分享

        贵州省 移动

        1. avatar

          钟于晴晴. Lv.1 Chrome 69.0.3497.100 Chrome 69.0.3497.100 Windows Windows 回复

          感谢分享

          湖南省衡阳市 电信

          1. avatar

            https://sqdxwz.top Lv.3 Sogou Explorer Sogou Explorer Windows Windows 回复

            谢谢分享--

            河南省焦作市 联通

            1. avatar

              还记得她 Lv.3 Chrome 78.0.3904.97 Chrome 78.0.3904.97 Windows Windows 回复

              谢谢分享

              中国 移动

              1. avatar

                y说说 Lv.3 Chrome 70.0.3538.80 Chrome 70.0.3538.80 Android 9 Android 9 回复

                滴!学生卡!打卡时间:10:45:38 PM,请上车的乘客系好安全带~
                睡觉睡觉

                山东省济宁市 联通

                1. avatar

                  y说说 Lv.3 Chrome 70.0.3538.80 Chrome 70.0.3538.80 Android 9 Android 9 回复

                  滴!学生卡!打卡时间:10:45:38 PM,请上车的乘客系好安全带~

                  山东省济宁市 联通

                  1. avatar

                    snowsword Lv.1 Chrome 56.0.2924.90 Chrome 56.0.2924.90 Windows 7 x64 Edition Windows 7 x64 Edition 回复

                    好厉害

                    山东省莱芜市 电信

                    1. avatar

                      September Lv.4 Chrome 69.0.3497.100 Chrome 69.0.3497.100 Windows 7 x64 Edition Windows 7 x64 Edition 回复

                      大萨达多所

                      浙江省金华市 电信