切版网(2013~2023)

http://qieban.cn
做完设计,找切版网
QQ:6135833
微信:dingxiangming82

2017年05月24日

威尔森

本文就“威尔森”展开讨论,作者切版网,发布于2017年05月24日 全文共3068个字,预计阅读时长10分13秒

演示地址:

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]

文章为原创或者来自于互联网,转载请注明来源,如果文章有侵权请联系,我们会及时删除。

更多相关文章

案例

遇见非凡

发布时间:2017年06月22日

项目地址 http://www.qieban.cn/html/yjff/

案例

和君

发布时间:2017年05月24日

访问网址: http://www.qieban.cn/html/hejun/ html代码: [codesyn […]

案例

BMJ

发布时间:2017年05月24日

演示地址: http://www.qieban.cn/html/bmj html代码: [codesyntax […]

案例

成都苗方清颜

发布时间:2017年05月24日

演示地址: http://www.qieban.cn/html/xiyou html代码: [codesynt […]

案例

福建电视台

发布时间:2017年05月24日

演示网址: http://www.qieban.cn/html/fujiandiantai html代码: [ […]

案例

海格润德

发布时间:2017年05月24日

演示地址: http://www.qieban.cn/html/haige html代码: [codesynt […]

查看更多