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%;} /*小红点背景 */