添加微信好友
演示地址：
http://www.qieban.cn/html/weiersen
html代码：
[codesyntax lang=”div”]
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,user-scalable=no"> <title>3 二级页面-量化决策 </title> <link rel="stylesheet" href="css/jquery.fullPage.css"/> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/responsive.css"/> <!--[if lt IE 9]> <script src="js/html5.js"></script> <![endif]--> </head> <body> <div class="header header-jc "> <div class="wrapper"> <div class="logo"> <a href="#"><img src="imgs/img23.png"/></a> </div> <div class="lang"> <a href="#">English</a> </div> <div class="sear"> <div class="ico">搜索</div> <div class="form"> <form action="" method="post"> <input type="text" class="text" name="" id="" value="" /> <input type="submit" class="submit" value=""/> </form> </div> </div> <div class="nav"> <ul> <li><a href="#">关于威尔森</a></li> <li><a href="#">建模咨询</a></li> <li><a href="#">市场监测分析</a></li> <li><a href="#">智能数据库</a></li> </ul> </div> <div class="gh"><a href="#"></a></div> </div> </div> <div id="layout">
[/codesyntax]
css代码：
[codesyntax lang=”css”]
.header{
clear: both; height: 107px; background: rgba(255,255,255,0.95); position: fixed; left: 0; right: 0; top: 0; z-index: 9; box-shadow: 0px 5px 80px rgba(0, 0, 0, 0.2); background: #fff;
}
.header .wrapper{
position: relative;
}
.header,
.header .logo,
.header .nav,
.header .lang,
.header .sear
{
transition: all 1s;
-webkit-transition: all 1s;
-ms-transition: all 1s;
}
.header.small{
height: 60px;
}
.header .logo{
float: left; display: inline; margin-top: 39px; width: 161px; height: 48px; margin-bottom: 20px;
}
.header.small .logo{
margin-top: 3px;
}
.header .nav{
float: right; display: inline; margin-top: 64px; text-align: right;
}
.header.small .nav{
margin-top: 20px;
}
.header .nav li{
font-size: 18px; display: inline-block; margin-right: 40px;
}
.header .nav li a{
color: #313234;
}
.header .nav li.small a,.header .nav li a:hover{
color: #0c4f8a;
}
.header.small .sear,
.header.small .lang{
margin-top: 24px;
}
.header .sear{
float: right; display: inline;margin-top: 70px; position: relative;width: 47px; height: 35px; text-align: center;
}
.header .sear .ico{
font-size: 13px; color: #7e7e7e; border: 1px solid transparent; padding-top: 5px; position: relative; top: -5px;
}
.header .on{width: 47px; border: 1px solid #C5C5C5 !important; height: 35px; border-bottom: none; text-align: center;}
.header .sear .form{position: absolute; right: -2px; top: 30px; z-index: 999; border: 1px solid #C5C5C5; width: 195px; background: #fff; border-top: none;}
.header .sear .form .text{width: 47px; height: 35px; padding-left: 5px; float: left; border: none; border-top: 1px solid #C5C5C5;}
.header .sear.curr .form .text{width: 143px;}
.header .sear .form .submit{float: left; background: url(../imgs/img41.jpg) #fff no-repeat center; border: none; width: 47px; height: 35px; cursor: pointer;}
.header .sear .form{
display: none;
}
.header .curr .form{display: block;}
.header .lang{
float: right; display: inline; margin-top: 70px; width: 60px; text-align: right;
}
.hslide{
clear: both; position: relative; overflow: hidden;
}
.hslide li{
position: relative;
}
.hslide li img{
display: block;
}
.hslide li h2{
font-size: 60px;color: #000; position: absolute; top: 50%; text-align: center; left: 0; right: 0;
}
[/codesyntax]
文章为原创或者来自于互联网，转载请注明来源，如果文章有侵权请联系，我们会及时删除。
