«

EMLOG添加顶部悬浮固定动态彩条的方法

时间:2019-9-19 09:15     作者:博客志     分类: emlog教程


相信站长朋友们都注意过一些博客网站顶部都有一个非常炫的悬浮固定的动态彩条,可以随着页面移动始终在最顶层,那么现在就来为大家分享一下EMLOG添加顶部悬浮固定动态彩条的方法。

一、操作步骤

1、打开模板文件header.php,在标签前添加如下代码

2、打开模板样式文件style.css,在适当的位置添加如下代码

/*Emlog顶部动态彩条*/ #top-img { background: url(https://ws2.sinaimg.cn/large/ea39e041gy1fsel4ovafog20ag004dfs.gif); height:4px;
    top:0px;
    position: fixed;
    width:100%;
    Z-index:9999;
}

3、打开网站首页,点击查看效果

二、原理解析

在网站顶部加入一个DIV,并给该DIV设置相关的属性

三、注意事项

1、本教程中的动态图片的链接可能会被设置防盗链,建议将该图片下载到自己的服务器上,然后再引用

2、本教程第1步中的top-img DIV位置需要根据模板的位置进行微调

3、本教程第2步中样式里的height不建议改动;top为外围距离顶部高度,可以自行调整;Position定义固定;Width为宽度,可适当调整;Z-index为层数,数值层数越高,即位于其他DIV模块之上。