www.gusucode.com > 51:【198-3365】仿寻模板网页模板下载素材销售下载站平台织梦模板 > 51:【198-3365】仿寻模板网页模板下载素材销售下载站平台织梦模板/templets/css/header.css

    /**
 * 页头
 *data:12-31
 **/
.header{background:#2c3e50; height:60px; width:100%;}
.headercon{ width:1180px; margin:0 auto; height:60px;background:url("../img/logo-bg.gif") no-repeat left center;}
/* 导航Logo */
.headercon .logo-t{width: 170px;height: 60px;display: block;float: left;}
.headercon .logo-t i{ font-size: 60px; color: #fff; margin-left: 16px;}

/* 导航 */
.headercon .nav-ul{float:left;}
.headercon .nav-ul li{float:left; width:89px;}
.headercon .nav-ul li a{color:#fff; font-size:14px; display:block;line-height:60px;text-align:center;}
.headercon .nav-ul li a:hover{background:#34495e; transition:all 0.3s;}
.headercon .nav-ul li .on{background:#34495e;}
.headercon .nav-ul li i.icon-new{position: absolute; right: 0; top: 20px; font-size: 14px; color: #E07527; background-color: #fff; width: 8px; text-indent: -3px; height: 8px; line-height: 8px; }

/* 登录 */
.right_login{float:left;margin-left:20px;}
.right_login a{ margin-top: 15px; color:#fff;float: left; font-size: 14px; color: #b8c4ce; border-radius: 3px; display: block; width: 50px; height:30px; line-height: 30px; text-align: center;}
.right_login a:hover{ background-color:#34495e; transition:all 0.2s;}

/* 下拉导航 */
.nav-ul li.onx{background-color:#34495e;}
.nav-ul li.onx .subnav-menu{display:block;}
.nav-ul li .subnav-menu{ height:0px; display:none; position: absolute; top: 60px; z-index:100; right:0; left: 0;width:150px; }
.nav-ul li .subnav-menu div{float:left;background: #314559;opacity:0.95;filter:alpha(opacity=95);-moz-opacity:0.95;-khtml-opacity:0.95; }
.nav-ul li .subnav-menu p { height: 47px;border-bottom: #34495E solid 1px;}
.nav-ul li .subnav-menu p a {text-align: left; font-size: 14px; display: block;height: 47px;line-height:47px;padding:0 16px;  }
.nav-ul li .subnav-menu p a:hover{background-color:#2c3e50;transition: background 0.2s ease-out;}

/* ===搜索下拉=== */
.header_right{float:right;}
.header_right .on {background-color: #34495e !important;transition: background 0.2s ease-out;}

/* == 搜索 15-01-12==*/
.search_cont{width:90px;position:relative;height:30px;background:#223242;border-radius:20px;}
.search_cont .in_search{font-size:12px;width:80%;outline:none;background:none;height:30px;float:left;border:0;color:#808e9d;padding-left:20%;position:absolute; z-index:1; box-shadow: none; }
.search_cont i.fa-search{font-size:14px;display:block;height:30px;width:30px;line-height:30px;text-align:center;position:absolute;top:0;right:5px;z-index:0;}
.search_start{height:30px;float:left;padding:15px 0;}
.search_start .in_submit{display:none;}
.search_start .ser .in_search{font-size:14px;color:#2c3e50;padding-left:20px;width:150px;}
.search_start .ser{background:#fff;}
.search_start .ser .fa-search{ cursor:pointer;}
.search_start .ser .in_submit{border:0;display:block;width:30px;height:30px;position:absolute;right:0;right: 5px;z-index:5; opacity:0;background:none; cursor:pointer;}

/* 上传 */
.header_right .right_updata{float:left;width:70px;margin-left:20px;width:50px;  position: relative;}
.header_right .right_updata .updata{float:left;width:50px;height:60px;}
.header_right .right_updata .updata:hover{height:60px;}
.header_right .right_updata .updata i{font-size: 27px; color: #808E9B; line-height: 60px; display: block; text-align: center;}

/* 用户消息 */
.header_right .right_m {float:left;margin-left:0;position: relative;}
.header_right .right_m .the-news{float:left;width: 50px;height:60px; position:relative;}
.header_right .right_m .the-news:hover{width: 50px;height:60px;}
.header_right .right_m .the-news i.fa-bell{font-size: 22px; color: #808E9B; line-height: 60px; display: block; text-align: center;}
.header_right .right_m .the-news i.icon-dot{background: none; width:12px; height: 12px; position: absolute; top:10px; right:5px; font-size: 12px; color: red; line-height: 15px;}
.header_right .right_m .the-news .red_dot{background: red; width:5px; height: 5px; position: absolute; top:15px; right:10px;border-radius: 50%;} /*小红点背景*/

/* 消息提醒下拉 */
.header_right .u-box-2 {background: #314559;opacity:0.95;filter:alpha(opacity=95);width:275px;position:absolute;margin-left:0;z-index:99; top:60px; right:0;}
.header_right .u-box-2 li { display:block;float:left;width:auto;padding:0 20px;text-align:left;position:relative;font-size:12px;border-bottom: #34495E solid 1px;height:auto;z-index:2;}
.header_right .u-box-2 li:hover{background-color:#2c3e50;transition: background 0.2s ease-out;}
.header_right .u-box-2 p i{ background: none;font-size: 18px; text-indent: 0; display: inline-block;position:absolute;left:28px;top:17px;}  
.header_right .u-box-2 li p{ float:left; width:205px; padding:15px 0 15px 30px; color:#FFF; font-size:12px; line-height:18px; color:#b8c4ce;}
.header_right .u-box-2 li p a{ font-size:12px; background:none; font-weight:bold; display:inline; padding:0 3px; height:auto; line-height:18px; color:#fff;}
.header_right .u-box-2 li p strong{ width:205px; clear:both; margin-top:5px; color:#4d657d; float:left; font-weight:normal;}
.header_right .u-box-2 li p span.nametit{font-weight:bold; color:#fff;font-size:12px;}

.header_right .u-box-2 li.infomsg_click{padding:0;}
.header_right .u-box-2 li.infomsg_click a{display:block;padding:0 20px;float:left;}

.header_right .u-box-2 i.guanzhu:before { content: "\e627"; color: #1abc9c; }/*对勾图标;*/
.header_right .u-box-2 i.shoucang:before { content: "\e638"; color: #1abc9c;}/*星星图标*/
.header_right .u-box-2 i.zan:before { content: "\e63d"; color: #3498db; }/*叶子图标*/
.header_right .u-box-2 i.pinglun:before,
.header_right .u-box-2 i.liuyan:before,
.header_right .u-box-2 i.xitong:before,
.header_right .u-box-2 i.tuijian:before{ content: "\e647"; color: #3498db;}/*评论图标*/

.header_right .u-box-2 i.icon-comment{color: #3498db;}/*评论蓝色*/
.header_right .u-box-2 i.icon-leaf-line{color: #1abc9c;}/*系统蓝色*/
.header_right .u-box-2 i.icon-ok-sign{color: #1abc9c;}/*关注绿色*/
.header_right .u-box-2 i.icon-star{color: #1abc9c;}/*收藏绿色*/

.header_right .u-box-2 .look_s{text-align:center;width:100%; position:relative;z-index:2;}
.header_right .u-box-2 .look_s a{font-size:14px;color:#fff;width:100%;font-weight:bold;display:block;text-align:center;height:47px;line-height:47px;}
.header_right .u-box-2 .look_s a:hover{background-color:#2c3e50;transition: background 0.2s ease-out;}

/* 退出登录 */
.header_right .right_men{float:left; margin-left:0; position: relative;}
.header_right .right_men .quit{ float:left;width: 50px;  height:60px; text-align:center;}
.header_right .right_men .quit img{margin-top: 20px; float: left; margin-left: 15px; border-radius: 10px; width: 20px; height: 20px;}
.header_right .right_men .quit i.icon-dot{background: none; width:12px; height: 12px; position: absolute; top:10px; right:5px; font-size: 12px; color: red; line-height: 15px;}
.header_right .right_men .quit .red_dot{background: red; width:5px; height: 5px; position: absolute; top:15px; right:10px;border-radius: 50%;} /*小红点背景 */

/* 上传-退出-登录下拉 */
.header_right .u-box-1 { top: 60px;width: 126px;position: absolute; right:0;z-index:99;}
.header_right .u-box-1 li {clear:both;text-align:left;font-size:12px;width:126px;height:47px;border-bottom:#34495E solid 1px;z-index: 1;}
.header_right .u-box-1 li a{clear:both;text-align:left;font-size:14px;color:#fff;display:block;background: #314559;opacity:0.95;filter:alpha(opacity=95);-moz-opacity:0.95;-khtml-opacity:0.95;}
.header_right .u-box-1 li a i{background: none; font-size: 18px; color: #fff; line-height: 47px; z-index: 1; position: relative; margin: 0 13px; display: inline-block;}
.header_right .u-box-1 li a:hover{background-color:#2c3e50;transition: background 0.2s ease-out;}
.header_right .u-box-1 li span.red_dot{background: red; width:5px; height: 5px; position: absolute; top:20px; right:10px;border-radius: 50%;} /*小红点背景 */