用户名

css/custom.css

@@ -84,6 +84,10 @@ a:hover{color: #1575db; text-decoration: none;}
 
 .innerPage .header .headerLink .innerButton{ padding: 5px 15px; font-size: 16px; letter-spacing: 0; line-height: 30px; display: inline-block; margin-left: 10px;}
 
+.innerPage .header .headerLink .userName{padding: 5px 35px 5px 15px; font-size: 16px; line-height: 30px; color: #fff; display: inline-block; border: 2px solid #1575db; background-color: #1575db; margin-left: 10px; border-radius: 30px 0 0 30px;}
+.innerPage .header .headerLink .userName + .innerButton{ margin-left: -30px; }
+.innerPage .header .headerLink .userName+.innerButton:hover{ border-left-color: #4295eb}
+
 .form-stack{ position: relative; display: inline-block; float: left;}
 .card-radio {position:relative; display: inline-block; border: 2px solid #fff; width: 150px; text-align: center; color: #c7e2fe; line-height: 30px; box-sizing: border-box; float: left; cursor: pointer; margin-bottom: 0; margin-left: -2px; border-radius: 30px; font-size: 16px; padding:5px  15px; font-weight: normal; background-color: #1887fd; }
 .card-radio.first{border-radius:22px 0 0 22px; }
@@ -370,7 +374,7 @@ h2.slogen{text-align: center; font-size: 50px; letter-spacing: 2px; font-weight:
   .header .headerLink .mobileIcon{ font-size: 24px;  width:40px; height:40px; text-align:center; color: #fff; border: 0; position: relative; background: none; padding: 0; border-radius: 0;}
   .header .headerLink .mobileIcon:hover{background: none;}
 
-  .innerPage .header .headerLink .innerButton{ display: none;} 
+  .innerPage .header .headerLink .innerButton, .innerPage .header .headerLink .userName{ display: none;} 
 
   .form-stack{width: 120px; position: absolute;right: 70px; top: 8px;}
   .form-stack .card-radio{width: 50%;}
@@ -388,7 +392,7 @@ h2.slogen{text-align: center; font-size: 50px; letter-spacing: 2px; font-weight:
 
 	.mobilemenu{  position: fixed; z-index: 2; top:50px; width:calc(100% - 40px); left: 20px; max-height: 80vh; overflow-y: auto; background-color:#fff; border-radius:20px; margin-top:5px; box-shadow: 0 2px 15px 0 rgba(0, 39, 102, .15);}
 
-  
+  .mobilemenu .info{ text-align: left; color: #9a9a9a; line-height: 20px; padding: 15px 15px 0; margin-bottom: 0;}
 	.mobilemenu .icon-double-angle-up{display: block; font-size:1.4em; text-align:center; color:#1887fd;; line-height:24px; border-radius:12px; background-color:#f8f8f8; margin-top: 10px;}
 	.mobilemenu .icon-double-angle-up:hover{ color:#fff;background-color:#1887fd;}
 	.mobilemenu ul{ padding:15px;}
@@ -454,7 +458,7 @@ h2.slogen{text-align: center; font-size: 50px; letter-spacing: 2px; font-weight:
   .data-group li{ width: 50%;}
   .data-group.data-type li{ width: 100%;}
 
-   .leftmenu ~ .content-box  .data-group.data-type li{width: 100%;}
+  .leftmenu ~ .content-box  .data-group.data-type li{width: 100%;}
 
   .brand-group li{ width: 50%;}
 

layout/innerHeader.php

@@ -73,11 +73,13 @@
           <a href="javascript:void(0);" class="button innerButton xs-hidden">实验室管理系统</a>
           <a href="javascript:void(0);" class="button innerButton xs-hidden"">试剂商城</a>
 
+          <span class="userName xs-hidden"">刘XX</span>
+          <a href="javascript:void(0);" class="button innerButton xs-hidden"">注销</a>
 
-          <a href="javascript:void(0);" class="button innerButton xs-hidden"">退出登录</a>
           <a href="javascript:void(0);" class="button mobileIcon xs-block" id="mobileIcon"><span></span></a>
           <!--手机版-->
           <nav class="mobilemenu" id="mobilemenu">
+            <p class="info">欢迎回来，刘XX</p>
             <ul>  
               <li><a href="index.php">首页</a></li>
               <li><a href="javascript:void(0);">我要卖产品</a></li>