2020-05-28

万能Header适用于所有DISCUZ模板，可以添加到页面头部，也可以单独调用。

<!--万能Header适用于所有DISCUZ模板，可以添加到页面头部，也可以单独调用，代码非常简单，简单到纯粹。-->
<--CSS部分：-->
<style type="text/css"> 
body{
    margin-top:55px;  //整个页面保留head位置，防止遮挡和卡屏
    width:99%;   //圆角居中效果宽度不能100%
}
.a_l{    //左侧按钮
    position: absolute;   //绝对定位；
    left:12px;
    font-size:18px;
}
#a_r{     //右侧按钮
    position: absolute;   //绝对定位；
    right:12px;
    font-size:18px;
}
.h2{  //页面标题
    color:#fff;   //字体颜色；
    line-height:50px;  //文字居中；
    font-size:20px;   //字体大小；
}
.bq{   //DIV容器
    width:97%;   //圆角居中效果页面不要用100%；
    height:45px;  //盒子高度；
    background-color:#EE3B3B;  //整体背景颜色；
    border-radius:5px;   //圆角化；
    position: absolute;  //绝对定位；
    left:5px;
    position: fixed;  //固定定位，防止IE不兼容absolute;
    top:0px;  //顶部高度；
    margin：0 auto;  //自动居中；
    z-index:999; //悬浮层的优先级，置于顶层；
}
</style>
<--html部分-->
        <div class="bq">
            <center>   //防止菜单因兼容性不居中，增强中属性
            <h2 class="h2">页面标题
            <span class="a_l" onClick="javascript :history.back(-1);">返回</span>
            
<!--例如:判断如果是我的相册，显示上传按钮-->    
<!--{if ...}--> //这里可以加入判断句来显示指定内容
    <a href="" id="a_r">功能按钮1</a>  //对谁才显示这个按钮
<!--else-->
    <a href="" id="a_r">功能按钮2</a>  //对谁才显示这个按钮
    <!--{/if}-->
<!--判断结束-->       
            </h2> 
        </center>    
</div>