4 years ago · 7b42d4b6bd
--- a/web/index.html
+++ b/web/index.html
@@ -16,4 +16,4 @@
 
				       "server": window.location.protocol +'//'+ window.location.host + window.location.pathname+ '../server/index.php?s=',
			
 
				       //"lang" :'en'
			
 
				       "lang" :'zh-cn'
			
 
				-  }</script><link href=./static/css/app.50fcaf54f61bc9c900c66f360d418a7b.css rel=stylesheet></head><body class=grey-bg><div id=app></div><div style=display:none>本网站基于开源版showdoc搭建，仅供私人使用。如需访问showdoc官网，请在搜索引擎里搜索showdoc字样或者直接访问showdoc.com.cn</div><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.451f9dec262f7b7fd825.js></script><script type=text/javascript src=./static/js/app.fb5fe5c4b292fb0fa52b.js></script></body></html>
			
 
				+  }</script><link href=./static/css/app.751079662a3a8073202ba64e29974cbc.css rel=stylesheet></head><body class=grey-bg><div id=app></div><div style=display:none>本网站基于开源版showdoc搭建，仅供私人使用。如需访问showdoc官网，请在搜索引擎里搜索showdoc字样或者直接访问showdoc.com.cn</div><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.451f9dec262f7b7fd825.js></script><script type=text/javascript src=./static/js/app.f1779eff25f74eed7f52.js></script></body></html>
			
--- a/web/static/css/app.50fcaf54f61bc9c900c66f360d418a7b.css
+++ b/web/static/css/app.50fcaf54f61bc9c900c66f360d418a7b.css
--- a/web/static/css/app.751079662a3a8073202ba64e29974cbc.css
+++ b/web/static/css/app.751079662a3a8073202ba64e29974cbc.css
--- a/web/static/css/qietu.css
+++ b/web/static/css/qietu.css
@@ -0,0 +1,162 @@
 
				+
			
 
				+/*reset*/
			
 
				+ html{-webkit-text-size-adjust:none; /*解决chrome浏览器下字体不能小于12px*/}
			
 
				+ body{ color:#000000; font-family:Verdana, Arial, Helvetica, sans-serif;}
			
 
				+a{outline:none; text-decoration:none;} a:hover{ text-decoration:underline;}
			
 
				+html{zoom:1;}html *{outline:0;zoom:1;} html button::-moz-focus-inner{border-color:transparent!important;}
			
 
				+body{overflow-x: hidden; font-size:12px;} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;} table{/*border-collapse:collapse;border-spacing:0;*/} fieldset,a img{border:0;} address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;} li{list-style:none;} caption,th{text-align:left;} h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;} q:before,q:after{content:'';}
			
 
				+input[type="submit"], input[type="reset"], input[type="button"], button { -webkit-appearance: none; /*去掉苹果的默认UI来渲染按钮*/} em,i{ font-style:normal;}
			
 
				+
			
 
				+
			
 
				+
			
 
				+/*common*/
			
 
				+.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden; }.clearfix {display:block;}.clear{ clear:both;}
			
 
				+.colwrapper { overflow:hidden; zoom:1 /*for ie*/; margin:5px auto; }
			
 
				+.strong{ font-weight: bold;} .left{ float: left;} .right{ float: right;} .center{ margin:0 auto; text-align:center;}
			
 
				+.show{ display:block; visibility:visible;}.hide{ display: none; visibility:hidden;}
			
 
				+.block{ display:block;} .inline{ display:inline;}
			
 
				+.break{ word-wrap:break-word;overflow:hidden; /*word-break:break-all;*/}
			
 
				+
			
 
				+.tal{ text-align:left} .tar{ text-align:right;}
			
 
				+
			
 
				+/*文字两侧对齐*/
			
 
				+.justify {
			
 
				+	text-align:justify;
			
 
				+	text-justify:distribute-all-lines;/*ie6-8*/
			
 
				+	text-align-last:justify;/* ie9*/
			
 
				+	-moz-text-align-last:justify;/*ff*/
			
 
				+	-webkit-text-align-last:justify;/*chrome 20+*/
			
 
				+}
			
 
				+
			
 
				+.toe{
			
 
				+	/*超出省略号*/
			
 
				+	 word-break:keep-all;
			
 
				+white-space:nowrap;
			
 
				+overflow:hidden;
			
 
				+text-overflow:ellipsis;
			
 
				+}
			
 
				+@media screen and (-webkit-min-device-pixel-ratio:0){/* chrome*/
			
 
				+	.justify:after{
			
 
				+		content:".";
			
 
				+		display: inline-block;
			
 
				+		width:100%;
			
 
				+		overflow:hidden;
			
 
				+		height:0;
			
 
				+	}
			
 
				+}
			
 
				+
			
 
				+  a{ color:inherit; text-decoration: none;}
			
 
				+  a:hover{ color:#3e6ed4; text-decoration: none;}
			
 
				+
			
 
				+body{font-family: "Microsoft YaHei",sans-serif;}
			
 
				+
			
 
				+.css3{
			
 
				+	/*transition: all 0.3s ease-in-out 0s;*/
			
 
				+
			
 
				+	-webkit-transform:translate3d(0, -20px, 0);
			
 
				+	-ms-transform:translate3d(0, -20px, 0);
			
 
				+	transform:translate3d(0, -20px, 0);
			
 
				+
			
 
				+	-webkit-transition-property:opacity, -webkit-transform;
			
 
				+	transition-property:opacity, transform;
			
 
				+	-webkit-transition-duration:1000ms;
			
 
				+	transition-duration:1000ms;
			
 
				+	-webkit-transition-timing-function:cubic-bezier(0.25, 0.46, 0.33, 0.98);
			
 
				+	transition-timing-function:cubic-bezier(0.25, 0.46, 0.33, 0.98);
			
 
				+
			
 
				+	-webkit-transition-delay:800ms;
			
 
				+	transition-delay:800ms
			
 
				+}
			
 
				+.css3.animated{
			
 
				+	-webkit-transform:translate3d(0, 0, 0);
			
 
				+	-ms-transform:translate3d(0, 0, 0);
			
 
				+	transform:translate3d(0, 0, 0);
			
 
				+}
			
 
				+@media screen and (max-width: 650px) {
			
 
				+
			
 
				+  }
			
 
				+
			
 
				+  @media screen and (max-width: 480px) {
			
 
				+
			
 
				+  }
			
 
				+
			
 
				+
			
 
				+/*手机下汉堡菜单*/
			
 
				+.gh {
			
 
				+
			
 
				+	height:34px;
			
 
				+	width:34px;
			
 
				+	margin-right:30px;
			
 
				+	position:absolute;
			
 
				+	right: 0; top: 20px;
			
 
				+	transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-webkit-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-ms-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	cursor:pointer;
			
 
				+	display: none;
			
 
				+}
			
 
				+.gh span {
			
 
				+	background-color: #fff;
			
 
				+	display: block;
			
 
				+	height: 2px;
			
 
				+	margin-top: -2px;
			
 
				+	position: relative;
			
 
				+	top: 50%;
			
 
				+	transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	width: 100%;
			
 
				+}
			
 
				+
			
 
				+.gh span:after, .gh span:before {
			
 
				+	background-color: #fff;
			
 
				+	content: "";
			
 
				+	display: block;
			
 
				+	height: 2px;
			
 
				+	left: 0;
			
 
				+	position: absolute;
			
 
				+	transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	width:100%;
			
 
				+}
			
 
				+.gh span:after {
			
 
				+	top:10px;
			
 
				+}
			
 
				+.gh span:before {
			
 
				+	top:-10px;
			
 
				+}
			
 
				+#mobile-menu-toggle{
			
 
				+	display: none;
			
 
				+}
			
 
				+#mobile-menu-toggle:checked + .gh span:after,
			
 
				+#mobile-menu-toggle:checked + .gh span:before {
			
 
				+	top: 0;
			
 
				+}
			
 
				+#mobile-menu-toggle:checked + .gh span:before {
			
 
				+	transform: translateY(0px) rotate(-45deg);
			
 
				+	-webkit-transform: translateY(0px) rotate(-45deg);
			
 
				+	-ms-transform: translateY(0px) rotate(-45deg);
			
 
				+}
			
 
				+#mobile-menu-toggle:checked + .gh span:after {
			
 
				+	transform: translateY(0px) rotate(45deg);
			
 
				+	-webkit-transform: translateY(0px) rotate(45deg);
			
 
				+	-ms-transform: translateY(0px) rotate(45deg);
			
 
				+}
			
 
				+#mobile-menu-toggle:checked + .gh span {
			
 
				+	background-color: transparent !important;
			
 
				+}
			
 
				+#mobile-menu-toggle:checked + .gh + .nav{
			
 
				+	max-height: 1000px;
			
 
				+}
			
 
				+.nav{
			
 
				+
			
 
				+}
			
 
				+
			
 
				+.gh+ .nav{
			
 
				+	/*height: auto;
			
 
				+		background: #2f6ea2;
			
 
				+		overflow: hidden;
			
 
				+		transition: 0.4s;
			
 
				+		padding: 0; max-height: 0;*/
			
 
				+}
			
--- a/web/static/css/responsive.css
+++ b/web/static/css/responsive.css
@@ -0,0 +1,227 @@
 
				+
			
 
				+* {
			
 
				+    margin: 0;
			
 
				+    padding: 0;
			
 
				+    -webkit-appearance: none; /*去掉浏览器默认样式*/
			
 
				+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
			
 
				+    -webkit-touch-callout: none;
			
 
				+    box-sizing: border-box;
			
 
				+}
			
 
				+
			
 
				+body,.body {
			
 
				+
			
 
				+    -webkit-text-size-adjust: 100%; /*关闭自动调整字体*/
			
 
				+    -webkit-overflow-scrolling: touch;
			
 
				+    overflow-scrolling: touch;
			
 
				+}
			
 
				+
			
 
				+
			
 
				+/*pad*/
			
 
				+img{
			
 
				+	max-width:100%;
			
 
				+}
			
 
				+
			
 
				+input[type="submit"], input[type="reset"], input[type="button"], button { -webkit-appearance: none; /*去掉苹果的默认UI来渲染按钮*/}
			
 
				+@media only screen and (max-width:1480px) {
			
 
				+	.wrapper{
			
 
				+    		width: 1240px;
			
 
				+    	}
			
 
				+    	.hbanner .wrapper{
			
 
				+    		background-size: 650px auto;
			
 
				+    	}
			
 
				+    	.hrow .txt h2{
			
 
				+    		font-size: 36px;
			
 
				+    	}
			
 
				+    	.hrow .txt p{
			
 
				+    		font-size: 18px;
			
 
				+    	}
			
 
				+
			
 
				+}
			
 
				+/* 电脑小屏--md */
			
 
				+    @media screen and (max-width:1200px){
			
 
				+    	.wrapper{
			
 
				+    		width: 1170px;
			
 
				+    	}
			
 
				+
			
 
				+    	/*价格*/
			
 
				+    	.mprice-main .wrapper{
			
 
				+	padding-left: 150px;
			
 
				+	position: relative;
			
 
				+	margin-right: 20px;
			
 
				+
			
 
				+}
			
 
				+.mprice-main{
			
 
				+	background-size: cover;
			
 
				+	padding-bottom: 40px;
			
 
				+	padding-top: 100px;
			
 
				+}
			
 
				+.mprice-main .itemwrap{
			
 
				+	white-space: nowrap;
			
 
				+	overflow-x: scroll;
			
 
				+	padding-top: 80px;
			
 
				+}
			
 
				+.mprice-main .item{
			
 
				+	float: none; display: inline-block;
			
 
				+	vertical-align: top;
			
 
				+	width: 200px;
			
 
				+}
			
 
				+.mprice-main .item ul.tit{
			
 
				+	padding-left: 20px;
			
 
				+}
			
 
				+.mprice-main .itemtit{
			
 
				+	position: absolute; left: 0; top: 0;
			
 
				+}
			
 
				+.mprice-main .item .btn a{
			
 
				+	width: 120px; height: 45px; line-height: 45px; font-size: 14px;
			
 
				+}
			
 
				+.mprice-explain{
			
 
				+	padding: 60px 0;
			
 
				+}
			
 
				+.mprice-explain .wrapper{
			
 
				+	padding: 0 20px;
			
 
				+}
			
 
				+
			
 
				+    }
			
 
				+    /* 平板--sm */
			
 
				+    @media screen and (max-width:992px) {
			
 
				+    	.gh{
			
 
				+		display: block;
			
 
				+	}
			
 
				+	.gh+ .nav{
			
 
				+	height: auto;
			
 
				+		background: #fff;
			
 
				+		overflow: hidden;
			
 
				+		transition: 0.4s;
			
 
				+		padding: 0; max-height: 0;
			
 
				+		margin-right: 0;
			
 
				+		float: none;
			
 
				+		width: 100%;
			
 
				+		text-align: center;
			
 
				+
			
 
				+}
			
 
				+.header .nav ul{
			
 
				+	padding: 20px 0;
			
 
				+}
			
 
				+.header .nav li{
			
 
				+	display: block;
			
 
				+	margin-left: 0;
			
 
				+}
			
 
				+.nav a{
			
 
				+	color: #000; display: block; padding: 10px 0;
			
 
				+}
			
 
				+.header{
			
 
				+	/*margin-top: 20px;*/
			
 
				+	padding-top: 20px;
			
 
				+}
			
 
				+.header .logo{
			
 
				+	margin-left: 20px;
			
 
				+}
			
 
				+	.wrapper{
			
 
				+		width: auto;
			
 
				+	}
			
 
				+	.hbanner .wrapper{
			
 
				+		background-size: 300px auto;
			
 
				+		background-position: center 100px;
			
 
				+		padding-top: 400px;
			
 
				+		height: auto;
			
 
				+		padding-bottom: 100px;
			
 
				+	}
			
 
				+	.hbanner-txt .btns a{
			
 
				+		width:auto; min-width: 120px; height: 45px; line-height: 45px;
			
 
				+	}
			
 
				+	.hbanner-txt{
			
 
				+		padding-left: 40px;
			
 
				+		/*text-align: center;*/
			
 
				+	}
			
 
				+	.hbanner-txt h2{
			
 
				+		font-size: 24px;
			
 
				+	}
			
 
				+	.hbanner-txt .list li{
			
 
				+		margin-bottom: 15px;
			
 
				+	}
			
 
				+	.hrow .img{
			
 
				+		width: auto; float: none; text-align: center;
			
 
				+		padding-top: 0;
			
 
				+	}
			
 
				+	.hrow{
			
 
				+		height: auto !important;
			
 
				+		padding-bottom: 100px;
			
 
				+		padding-top: 100px;
			
 
				+	}
			
 
				+	.hrow .txt{
			
 
				+		width: auto; float: none; padding-top: 40px;
			
 
				+	}
			
 
				+	.hrow .img>img{
			
 
				+		max-width: 220px;
			
 
				+	}
			
 
				+	.hrow .txt h2{
			
 
				+		font-size: 24px; margin-bottom: 20px;
			
 
				+	}
			
 
				+	.hrow .txt p{
			
 
				+		font-size: 14px; padding-bottom: 10px;
			
 
				+	}
			
 
				+
			
 
				+	.hfoot{
			
 
				+		padding-top: 100px;
			
 
				+		height: auto;
			
 
				+		padding-bottom: 120px;
			
 
				+		background-size: cover;
			
 
				+	}
			
 
				+	.hfoot h2{
			
 
				+		font-size: 24px;
			
 
				+	}
			
 
				+	.hfoot h2 br{
			
 
				+	display: block;
			
 
				+}
			
 
				+.hfoot .btn{
			
 
				+	width:auto; min-width: 120px; height: 45px; line-height: 45px;
			
 
				+}
			
 
				+
			
 
				+/*下载*/
			
 
				+.downpage{
			
 
				+	width: auto; margin-left: 20px; margin-right: 20px;
			
 
				+	margin-top: 100px;
			
 
				+	margin-bottom: 100px;
			
 
				+}
			
 
				+.downlist{
			
 
				+	padding: 40px 0;
			
 
				+}
			
 
				+.downlist .body{
			
 
				+	margin-top: 40px;
			
 
				+}
			
 
				+.downlist .body li{
			
 
				+	display: block; margin-bottom: 40px;
			
 
				+}
			
 
				+.downlist .body .btn a{
			
 
				+	width: auto; min-width: 120px; height: 45px; line-height: 45px; font-size: 14px;
			
 
				+}
			
 
				+
			
 
				+/*注册*/
			
 
				+.form-box{
			
 
				+	width: auto; margin-left: 20px; margin-right: 20px;
			
 
				+	margin-top: 150px;
			
 
				+	margin-bottom: 100px;
			
 
				+}
			
 
				+.form{
			
 
				+	padding: 20px;
			
 
				+	padding-top: 70px;
			
 
				+}
			
 
				+.form-btns button{
			
 
				+	height: 45px; line-height: 45px; font-size: 14px;
			
 
				+}
			
 
				+.form-list .text{
			
 
				+	height: 45px;
			
 
				+}
			
 
				+.form-list .textcode + img{
			
 
				+	height: 45px; width: 100px;
			
 
				+}
			
 
				+
			
 
				+/*价格*/
			
 
				+
			
 
				+
			
 
				+    }
			
 
				+    @media screen and (max-width:768px){
			
 
				+    	/*.wrapper{
			
 
				+    		width: 750px;
			
 
				+    	}*/
			
 
				+    }
			
--- a/web/static/css/style.css
+++ b/web/static/css/style.css
@@ -0,0 +1,534 @@
 
				+*{
			
 
				+	box-sizing: border-box;
			
 
				+}
			
 
				+.body,body,select,input,view,text,button,textarea{
			
 
				+     font-family: 'PingFang SC','microsoft yahei',arial,'helvetica neue','hiragino sans gb',sans-serif;
			
 
				+}
			
 
				+body,.body{
			
 
				+	font-size: 14px; color: #fff; background-color: #111111;
			
 
				+	overflow-x: hidden;line-height: 1.6;
			
 
				+}
			
 
				+a{
			
 
				+	color: inherit;
			
 
				+}
			
 
				+a:hover{
			
 
				+	color: inherit;
			
 
				+}
			
 
				+img{
			
 
				+	max-width: 100%;
			
 
				+}
			
 
				+
			
 
				+.clearfix:after{
			
 
				+	content: "";display: table; clear: both; height: 0; visibility: hidden;
			
 
				+}
			
 
				+.fl{
			
 
				+	float: left;
			
 
				+}
			
 
				+.fr{
			
 
				+	float: right;
			
 
				+}
			
 
				+
			
 
				+/*header*/
			
 
				+.header{
			
 
				+	/*margin-top: 50px; position: absolute;*/ left: 0; right: 0; top: 0;
			
 
				+
			
 
				+	/**/
			
 
				+	background: #111111;
			
 
				+	position: fixed;
			
 
				+	padding-top: 50px;
			
 
				+	padding-bottom: 20px;
			
 
				+	z-index: 99;
			
 
				+}
			
 
				+
			
 
				+.header .logo{
			
 
				+	margin-left: 55px; float: left;
			
 
				+}
			
 
				+.header .nav{
			
 
				+	float: right; margin-right: 60px;
			
 
				+	font-weight: 400;
			
 
				+}
			
 
				+.header .nav li{
			
 
				+	margin-left: 55px; display: inline-block;vertical-align: middle;font-size: 16px;
			
 
				+}
			
 
				+.header .nav li.active a,
			
 
				+.header .nav li a:hover{
			
 
				+	color: #369FFF;
			
 
				+}
			
 
				+.form-box{
			
 
				+	width: 400px; margin: 200px auto 170px;
			
 
				+}
			
 
				+.form-tit{
			
 
				+	text-align: center;font-size: 22px; margin-bottom: 20px;
			
 
				+}
			
 
				+.form{
			
 
				+	background: #202020;border-radius: 4px; padding: 55px 55px 55px 55px;
			
 
				+	position: relative;
			
 
				+}
			
 
				+.form-err{
			
 
				+	background: #FF6A6A;
			
 
				+border-radius: 4px 4px 0 0;
			
 
				+position: absolute; left: 0; right: 0; top: 0;
			
 
				+ padding: 10px;
			
 
				+ font-style: normal;
			
 
				+font-weight: normal;
			
 
				+font-size: 12px;
			
 
				+text-align: center;
			
 
				+}
			
 
				+.form-list li{
			
 
				+	margin-bottom: 15px;
			
 
				+}
			
 
				+
			
 
				+.form-list .text{
			
 
				+	width: 100%; height: 52px;
			
 
				+	background: #111111;
			
 
				+border-radius: 4px; border: 0; font-size: 14px;color: #989898; padding: 0 15px;
			
 
				+border: #111111 solid 1px;
			
 
				+}
			
 
				+.form-list .text-err{
			
 
				+	border-color: #FF6A6A;
			
 
				+}
			
 
				+.form-list .textcode{
			
 
				+	width: 160px;
			
 
				+}
			
 
				+.form-list .textcode + img{
			
 
				+	vertical-align: middle;
			
 
				+	width: 116px; height: 52px;
			
 
				+}
			
 
				+.form-list .text:focus{
			
 
				+	border: #369FFF solid 1px;
			
 
				+}
			
 
				+.form-list a:hover{
			
 
				+	color: #369FFF;
			
 
				+}
			
 
				+.form-btns{
			
 
				+	margin-top: 50px;text-align: center;
			
 
				+}
			
 
				+.form-btns li+li{
			
 
				+	margin-top: 10px;
			
 
				+}
			
 
				+.form-btns .btn{
			
 
				+	width: 100%; height: 55px; background: #FFFFFF; font-size: 16px; color: #111111;
			
 
				+	border: 1px solid #FFFFFF;
			
 
				+box-sizing: border-box;
			
 
				+border-radius: 4px;
			
 
				+cursor: pointer;
			
 
				+display: inline-block;
			
 
				+line-height: 55px;
			
 
				+}
			
 
				+.form-btns .btn:hover{
			
 
				+	background: #369FFF !important;
			
 
				+	border-color: #369FFF !important;
			
 
				+	color: #fff !important;
			
 
				+}
			
 
				+.form-btns .btn.btn1{
			
 
				+	background: transparent; color: #fff;
			
 
				+}
			
 
				+.form-other{
			
 
				+	text-align: center;margin-top: 15px;
			
 
				+}
			
 
				+.form-other .hd{
			
 
				+	color: #4E4E4E;
			
 
				+}
			
 
				+.form-other .bd{
			
 
				+	margin-top: 15px;
			
 
				+}
			
 
				+
			
 
				+/*首页*/
			
 
				+.wrapper{
			
 
				+	width: 1440px; margin: 0 auto;
			
 
				+
			
 
				+}
			
 
				+.hbanner{
			
 
				+
			
 
				+}
			
 
				+.hbanner .wrapper{
			
 
				+	background: url(../imgs/home1.png) no-repeat right center;
			
 
				+	height: 940px;
			
 
				+	padding-top: 305px;
			
 
				+}
			
 
				+.hbanner-txt{
			
 
				+	padding-left: 155px;
			
 
				+}
			
 
				+.hbanner-txt h2{
			
 
				+	font-size: 40px;
			
 
				+line-height: 160%;
			
 
				+color: #fff;
			
 
				+font-weight: bold;
			
 
				+margin-bottom: 55px;
			
 
				+}
			
 
				+.hbanner-txt h2 font{
			
 
				+	color: #369FFF;
			
 
				+}
			
 
				+.hbanner-txt .list{
			
 
				+	font-size: 14px;
			
 
				+line-height: 20px;
			
 
				+}
			
 
				+.hbanner-txt .list li{
			
 
				+	margin-bottom: 24px;
			
 
				+}
			
 
				+.hbanner-txt .list li:last-child{
			
 
				+	margin-bottom: 0;
			
 
				+}
			
 
				+.hbanner-txt .list .num{
			
 
				+	background: #333333;
			
 
				+border-radius: 1px;
			
 
				+margin-left: 5px;
			
 
				+padding: 0 3px;
			
 
				+font-family: 'Barlow-Regular';
			
 
				+}
			
 
				+.hbanner-txt .btns{
			
 
				+	margin-top: 60px;
			
 
				+}
			
 
				+.hbanner-txt .btns a{
			
 
				+	width: 130px;
			
 
				+height: 55px;
			
 
				+line-height: 55px;
			
 
				+text-align: center;
			
 
				+display: inline-block;
			
 
				+border: 1px solid #FFFFFF;
			
 
				+box-sizing: border-box;
			
 
				+border-radius: 4px;
			
 
				+margin-right: 24px;
			
 
				+/*transition: 0.4s;*/
			
 
				+}
			
 
				+.hbanner-txt .btns a:hover{
			
 
				+	background: #369FFF !important;
			
 
				+	color: #fff !important;
			
 
				+	border-color: #369FFF;
			
 
				+}
			
 
				+.hbanner-txt  .btns a.on{
			
 
				+	color: #111111;
			
 
				+	background: #fff;
			
 
				+}
			
 
				+
			
 
				+.hrow{
			
 
				+	height: 634px;
			
 
				+}
			
 
				+.hrow .wrapper{
			
 
				+	/*overflow: hidden;*/
			
 
				+	padding: 0 10%;
			
 
				+}
			
 
				+.hrow .fl{
			
 
				+	float: left;
			
 
				+}
			
 
				+.hrow .fr{
			
 
				+	float: right;
			
 
				+}
			
 
				+.hrow .txt{
			
 
				+	/*padding-left: 155px;*/
			
 
				+	padding-top: 210px;
			
 
				+	/*width: 570px;*/
			
 
				+	width: 53%;
			
 
				+}
			
 
				+.hrow .txt h2{
			
 
				+	font-weight: 600;
			
 
				+font-size: 40px;
			
 
				+line-height: 160%;
			
 
				+margin-bottom: 50px;
			
 
				+}
			
 
				+.hrow .txt p{
			
 
				+	font-size: 22px;
			
 
				+line-height: 1.4;
			
 
				+padding-bottom: 30px;
			
 
				+}
			
 
				+.hrow .txt p img{
			
 
				+	margin-right: 13px;
			
 
				+}
			
 
				+.hrow .img{
			
 
				+	/*padding-top: 120px;*/
			
 
				+	padding-top: 110px;
			
 
				+	/*width: 500px;*/
			
 
				+	width: 43%;
			
 
				+}
			
 
				+.hrow1{
			
 
				+	background: #202020;
			
 
				+	height: 634px;
			
 
				+}
			
 
				+.hrow1 .img{
			
 
				+	position: relative;
			
 
				+}
			
 
				+.hrow1 .img> .box{
			
 
				+	position: absolute; left: 0; top: -50px;
			
 
				+}
			
 
				+.hrow1 .img>img{
			
 
				+	position: relative; z-index: 2;
			
 
				+}
			
 
				+.hrow2{
			
 
				+	background: #369FFF;
			
 
				+	height: 634px;
			
 
				+}
			
 
				+.hrow3{
			
 
				+	background: #111111;
			
 
				+	height: 634px;
			
 
				+}
			
 
				+.hrow4{
			
 
				+	background: #202020;
			
 
				+	height: 570px;
			
 
				+}
			
 
				+.hrow5{
			
 
				+	background: #369FFF;
			
 
				+	height: 634px;
			
 
				+}
			
 
				+.hrow6{
			
 
				+	background: #111111;
			
 
				+	height: 617px;
			
 
				+}
			
 
				+.hrow7{
			
 
				+	background: #202020;
			
 
				+	height: 617px;
			
 
				+}
			
 
				+.hfoot{
			
 
				+	height: 594px;
			
 
				+	background: url(../imgs/home9.png) no-repeat center top #fff;
			
 
				+	color: #111111;
			
 
				+	text-align: center;
			
 
				+	padding-top: 280px;
			
 
				+	position: relative;
			
 
				+}
			
 
				+.hfoot h2{
			
 
				+	font-size: 40px;
			
 
				+line-height: 160%;
			
 
				+font-weight: bold;
			
 
				+}
			
 
				+.hfoot h2 br{
			
 
				+	display: none;
			
 
				+}
			
 
				+.hfoot .num{
			
 
				+	background: #DFF0FF;
			
 
				+	color: #369FFF;
			
 
				+	font-weight: bold;
			
 
				+border-radius: 1px;
			
 
				+margin-right: 1px;
			
 
				+padding: 0 6px;
			
 
				+font-family: 'Barlow-Regular';
			
 
				+}
			
 
				+.hfoot .btn{
			
 
				+	display: inline-block;
			
 
				+	width: 130px;
			
 
				+height: 55px;
			
 
				+line-height: 55px;
			
 
				+background: #111111;
			
 
				+border-radius: 4px;
			
 
				+margin-top: 24px;
			
 
				+font-size: 16px;
			
 
				+color: #fff;
			
 
				+/*transition: 0.4s;*/
			
 
				+}
			
 
				+.hfoot .btn:hover{
			
 
				+	background: #369FFF;
			
 
				+}
			
 
				+.hfoot .copyright {
			
 
				+	color: #9C9C9C;
			
 
				+	position: absolute;
			
 
				+	left: 0; right: 0; text-align: center; bottom: 35px;
			
 
				+}
			
 
				+
			
 
				+/*价格*/
			
 
				+.mprice-main{
			
 
				+	background:#111111 url(../imgs/bg1.png) no-repeat center top;
			
 
				+	padding-top: 200px;
			
 
				+	padding-bottom: 210px;
			
 
				+	text-align: center;
			
 
				+}
			
 
				+.mprice-main .wrapper{
			
 
				+	overflow: hidden;
			
 
				+	/*padding-left: 140px;*/
			
 
				+	padding-top: 80px;
			
 
				+
			
 
				+}
			
 
				+.mprice-main .item{
			
 
				+	width: 218px;
			
 
				+/*float: left;*/
			
 
				+display: inline-block;
			
 
				+vertical-align: top;
			
 
				+text-align: center;
			
 
				+margin-right: 24px;
			
 
				+cursor: pointer;
			
 
				+transition: 0.4s;
			
 
				+-webkit-transition: 0.4s;
			
 
				+}
			
 
				+.mprice-main .item:hover{
			
 
				+	transform:translateY(-20px);
			
 
				+	-webkit-transform:translateY(-20px);
			
 
				+}
			
 
				+.mprice-main .itemtit:hover{
			
 
				+	transform:translateY(0);
			
 
				+	-webkit-transform:translateY(0);
			
 
				+}
			
 
				+.mprice-main .item .title{
			
 
				+	font-style: normal;
			
 
				+font-weight: 600;
			
 
				+font-size: 22px;
			
 
				+height: 60px;
			
 
				+}
			
 
				+.mprice-main .itembox{
			
 
				+	background: #202020;
			
 
				+border-radius: 4px;
			
 
				+height: 902px;
			
 
				+padding-top: 46px;
			
 
				+position: relative;
			
 
				+padding-bottom: 130px;
			
 
				+}
			
 
				+.mprice-main .itembox-bgnone{
			
 
				+	background: none;
			
 
				+}
			
 
				+.mprice-main .itembox-border{
			
 
				+	background: #111111;
			
 
				+border: 1px solid #202020;
			
 
				+
			
 
				+}
			
 
				+.mprice-main .itembox-border li{
			
 
				+	border-bottom: #202020 solid 1px;
			
 
				+}
			
 
				+.mprice-main .itembox-highlight{
			
 
				+	background: #369FFF;
			
 
				+}
			
 
				+.mprice-main .item ul{
			
 
				+	padding: 0 25px;
			
 
				+}
			
 
				+.mprice-main .item ul.tit{
			
 
				+	color: #989898;
			
 
				+	text-align: left;
			
 
				+	padding-left: 50px;
			
 
				+}
			
 
				+.mprice-main .item  li{
			
 
				+	padding: 20px 0;
			
 
				+}
			
 
				+.mprice-main .item  li.num{
			
 
				+	height: 90px;
			
 
				+	padding: 0;
			
 
				+	border: none;
			
 
				+	font-family: "Barlow-Regular";
			
 
				+}
			
 
				+.mprice-main .item  li.num big{
			
 
				+	font-size: 40px;
			
 
				+	font-weight: bold;
			
 
				+}
			
 
				+.mprice-main .item .btn{
			
 
				+	position: absolute; left: 0; right: 0; bottom: 35px;
			
 
				+}
			
 
				+.mprice-main .item .btn a{
			
 
				+	width: 130px;
			
 
				+height: 55px;
			
 
				+line-height: 55px;
			
 
				+text-align: center;
			
 
				+border: 1px solid #FFFFFF;
			
 
				+box-sizing: border-box;
			
 
				+border-radius: 4px;
			
 
				+display: inline-block;
			
 
				+}
			
 
				+.mprice-main .item .btn a:hover{
			
 
				+	background: #369FFF;
			
 
				+	border-color: #369FFF;
			
 
				+}
			
 
				+.mprice-main .itembox-highlight .btn a{
			
 
				+	color: #369FFF;
			
 
				+	background: #fff;
			
 
				+}
			
 
				+.mprice-main .itembox-highlight .btn a:hover{
			
 
				+	border-color: #fff;
			
 
				+	color: #fff;
			
 
				+}
			
 
				+.mprice-explain{
			
 
				+	background: #202020;
			
 
				+	padding: 60px 0 150px;
			
 
				+
			
 
				+}
			
 
				+.mprice-explain .wrapper{
			
 
				+	padding: 0 155px;
			
 
				+}
			
 
				+.mprice-explain h3{
			
 
				+	font-style: normal;
			
 
				+font-weight: 600;
			
 
				+font-size: 22px;
			
 
				+margin-bottom: 60px;
			
 
				+}
			
 
				+.mprice-explain p{
			
 
				+	margin-bottom: 24px;
			
 
				+	font-size: 14px;
			
 
				+
			
 
				+}
			
 
				+
			
 
				+/*下载*/
			
 
				+.downpage{
			
 
				+
			
 
				+width: 736px;
			
 
				+/*height: 821px;*/
			
 
				+background: #202020;
			
 
				+border-radius: 4px;
			
 
				+margin: 0 auto;
			
 
				+margin-top: 210px;
			
 
				+margin-bottom: 270px;
			
 
				+padding: 24px;
			
 
				+}
			
 
				+.downlist{
			
 
				+	border-bottom: #333333 solid 1px;
			
 
				+	padding: 60px 0;
			
 
				+}
			
 
				+.downlist .head{
			
 
				+	font-style: normal;
			
 
				+font-weight: 600;
			
 
				+font-size: 22px; text-align: center;
			
 
				+}
			
 
				+.downlist .dbody{
			
 
				+	margin-top: 60px;
			
 
				+	text-align: center;
			
 
				+}
			
 
				+.downlist .dbody li{
			
 
				+	display: inline-block; margin: 0 30px;
			
 
				+}
			
 
				+.downlist .dbody .txt{
			
 
				+	font-style: normal;
			
 
				+font-weight: normal;
			
 
				+font-size: 14px;
			
 
				+color: #989898;
			
 
				+margin-top: 15px;
			
 
				+}
			
 
				+.downlist .dbody .btn{
			
 
				+	margin-top: 20px;
			
 
				+}
			
 
				+.downlist .dbody .btn a{
			
 
				+	width: 130px;
			
 
				+height: 55px;
			
 
				+line-height: 55px;
			
 
				+text-align: center;
			
 
				+border: 1px solid #FFFFFF;
			
 
				+box-sizing: border-box;
			
 
				+border-radius: 4px;
			
 
				+display: inline-block;
			
 
				+font-style: normal;
			
 
				+font-weight: 500;
			
 
				+font-size: 16px;
			
 
				+}
			
 
				+.downlist .dbody .btn a.on{
			
 
				+	background: #fff;
			
 
				+	color: #111111;
			
 
				+}
			
 
				+.downlist .dbody .btn a:hover{
			
 
				+	background: #369FFF;
			
 
				+	border-color: #369FFF;
			
 
				+	color: #fff;
			
 
				+}
			
 
				+.downlist .dbody .link{
			
 
				+	margin-top: 20px;
			
 
				+}
			
 
				+.downlist .dbody .link a{
			
 
				+	text-decoration: underline;
			
 
				+	font-style: normal;
			
 
				+font-weight: 500;
			
 
				+font-size: 16px;
			
 
				+}
			
 
				+.downlist + .downlist{
			
 
				+	border: none;
			
 
				+}
			
 
				+.downtip{
			
 
				+	font-style: normal;
			
 
				+font-weight: normal;
			
 
				+font-size: 12px;
			
 
				+line-height: 17px;
			
 
				+color: #666666;
			
 
				+padding-top: 24px;
			
 
				+}
			
 
				+.regbg{
			
 
				+	background:#111111 url(../imgs/regbg.jpg) no-repeat center top;
			
 
				+}
			
--- a/web/static/img/bg1.97db6cb.png
+++ b/web/static/img/bg1.97db6cb.png
--- a/web/static/img/home1.cf81ad2.png
+++ b/web/static/img/home1.cf81ad2.png
--- a/web/static/img/home9.7fab5f7.png
+++ b/web/static/img/home9.7fab5f7.png
--- a/web/static/img/regbg.5030481.jpg
+++ b/web/static/img/regbg.5030481.jpg
--- a/web/static/imgs/Android.png
+++ b/web/static/imgs/Android.png
--- a/web/static/imgs/Auto.png
+++ b/web/static/imgs/Auto.png
--- a/web/static/imgs/Logo.png
+++ b/web/static/imgs/Logo.png
--- a/web/static/imgs/Mac.png
+++ b/web/static/imgs/Mac.png
--- a/web/static/imgs/Server.png
+++ b/web/static/imgs/Server.png
--- a/web/static/imgs/Vector
+++ b/web/static/imgs/Vector
--- a/web/static/imgs/Vector.png
+++ b/web/static/imgs/Vector.png
--- a/web/static/imgs/Vector1.png
+++ b/web/static/imgs/Vector1.png
--- a/web/static/imgs/Wechat.png
+++ b/web/static/imgs/Wechat.png
--- a/web/static/imgs/Windows.png
+++ b/web/static/imgs/Windows.png
--- a/web/static/imgs/bg1.png
+++ b/web/static/imgs/bg1.png
--- a/web/static/imgs/bg2-1.png
+++ b/web/static/imgs/bg2-1.png
--- a/web/static/imgs/bg2-2.png
+++ b/web/static/imgs/bg2-2.png
--- a/web/static/imgs/bg2-3.png
+++ b/web/static/imgs/bg2-3.png
--- a/web/static/imgs/bg2-4.png
+++ b/web/static/imgs/bg2-4.png
--- a/web/static/imgs/bg2-5.png
+++ b/web/static/imgs/bg2-5.png
--- a/web/static/imgs/code.png
+++ b/web/static/imgs/code.png
--- a/web/static/imgs/home1.png
+++ b/web/static/imgs/home1.png
--- a/web/static/imgs/home2-1111111.png
+++ b/web/static/imgs/home2-1111111.png
--- a/web/static/imgs/home2-img.png
+++ b/web/static/imgs/home2-img.png
--- a/web/static/imgs/home2.png
+++ b/web/static/imgs/home2.png
--- a/web/static/imgs/home3.png
+++ b/web/static/imgs/home3.png
--- a/web/static/imgs/home4.png
+++ b/web/static/imgs/home4.png
--- a/web/static/imgs/home5.png
+++ b/web/static/imgs/home5.png
--- a/web/static/imgs/home6.png
+++ b/web/static/imgs/home6.png
--- a/web/static/imgs/home7.png
+++ b/web/static/imgs/home7.png
--- a/web/static/imgs/home8.png
+++ b/web/static/imgs/home8.png
--- a/web/static/imgs/home9.png
+++ b/web/static/imgs/home9.png
--- a/web/static/imgs/iOS.png
+++ b/web/static/imgs/iOS.png
--- a/web/static/imgs/regbg.jpg
+++ b/web/static/imgs/regbg.jpg
--- a/web/static/js/app.f1779eff25f74eed7f52.js
+++ b/web/static/js/app.f1779eff25f74eed7f52.js
--- a/web/static/js/app.fb5fe5c4b292fb0fa52b.js
+++ b/web/static/js/app.fb5fe5c4b292fb0fa52b.js
--- a/web/static/lang/en.js
+++ b/web/static/lang/en.js
@@ -7,25 +7,42 @@ exports.default = {
 
				   my_item: 'My items',
			
 
				   section_title1: 'ShowDoc',
			
 
				   section_description1: ' A tool greatly applicable for an IT team',
			
 
				+  section_description1_1: 'A tool greatly applicable',
			
 
				+  section_description1_2: 'for an IT team',
			
 
				   section_title2: 'API Document',
			
 
				-  section_description2:
			
 
				-    'ShowDoc can compile exquisite API documents <br>in a very fast and convenient way',
			
 
				+  section_description2_1:
			
 
				+    'ShowDoc can compile exquisite API documents',
			
 
				+  section_description2_2:
			
 
				+    'in a very fast and convenient way',
			
 
				   section_title3: 'Data Dictionary',
			
 
				-  section_description3:
			
 
				-    'A good Data Dictionary can easily exhibit database structure to other people<br>ShowDoc can compile exquisite Data Dictionary',
			
 
				+  section_description3_1:
			
 
				+    'A good Data Dictionary can easily exhibit database structure to other people',
			
 
				+  section_description3_2:
			
 
				+    'ShowDoc can compile exquisite Data Dictionary',
			
 
				   section_title4: 'Explanation Document',
			
 
				-  section_description4:
			
 
				+  section_description4_1:
			
 
				+    'You can absolutely use ShowDoc to compile the explanation documents for some tools',
			
 
				+  section_description4_2:
			
 
				     'You can absolutely use ShowDoc to compile the explanation documents for some tools',
			
 
				   section_title5: 'Team Work',
			
 
				   section_description5: 'Your team will work with ShowDoc together very well ',
			
 
				-  section_title6: 'Open Source',
			
 
				-  section_description6:
			
 
				-    'ShowDoc is a free, open source tool that <br>you can deploy it to your own server',
			
 
				-  section_title7: 'Hosted online',
			
 
				-  section_description7:
			
 
				-    'Www.showdoc.cc provide security and stability of the document hosting service',
			
 
				-  section_title8: 'Try it now',
			
 
				-  section_description8: 'Over 10000+ IT team is using ShowDoc',
			
 
				+  section_title6: 'Document Automation',
			
 
				+  section_description6_1:
			
 
				+    'Documents can be generated automatically from code comments',
			
 
				+  section_description6_2:
			
 
				+    'With the runapi client, you can debug the interface and automatically generate documents',
			
 
				+  section_title7: 'Open Source',
			
 
				+  section_description7_1:
			
 
				+    'ShowDoc is a free, open source tool',
			
 
				+  section_description7_2:
			
 
				+    'You can deploy it to your own server',
			
 
				+  section_title8: 'Hosted online',
			
 
				+  section_description8_1:
			
 
				+    'www.showdoc.com.cn provide security and stability of the document hosting service',
			
 
				+  section_description8_2:
			
 
				+    'You can safely choose to host your document data in the cloud',
			
 
				+  section_title9: 'Try it now',
			
 
				+  section_description9: 'Over 100000+ IT team is using ShowDoc',
			
 
				 
			
 
				   // user
			
 
				   login: 'Login',
			
--- a/web/static/lang/zh-CN.js
+++ b/web/static/lang/zh-CN.js
@@ -6,26 +6,42 @@ exports.default = {
 
				   index_login_or_register: '登录 / 注册',
			
 
				   my_item: '我的项目',
			
 
				   section_title1: 'ShowDoc',
			
 
				-  section_description1: '一个非常适合IT团队的在线API文档、技术文档工具',
			
 
				+  section_description1_1: '一个非常适合IT团队的',
			
 
				+  section_description1_2: '在线API文档、技术文档工具',
			
 
				   section_title2: 'API文档',
			
 
				-  section_description2:
			
 
				-    ' APP、web前端与服务器常用API来进行交互<br>用ShowDoc可以非常方便快速地编写出美观的API文档',
			
 
				+  section_description2_1:
			
 
				+    'APP、web前端与服务器常用API来进行交互',
			
 
				+  section_description2_2:
			
 
				+    'ShowDoc可以非常方便快速地编写出美观的API文档',
			
 
				   section_title3: '数据字典',
			
 
				-  section_description3:
			
 
				-    '好的数据字典可以很方便地向别人描述你的数据库结构<br>用ShowDoc可以编辑出美观的数据字典',
			
 
				+  section_description3_1:
			
 
				+    '好的数据字典可以方便地向别人描述你的数据库结构',
			
 
				+  section_description3_2:
			
 
				+    '用ShowDoc可以编辑出美观的数据字典',
			
 
				   section_title4: '说明文档',
			
 
				-  section_description4:
			
 
				-    '你完全可以使用 ShowDoc来编写一些工具的说明书<br>也可以编写一些技术规范说明文档以供团队查阅',
			
 
				+  section_description4_1:
			
 
				+    '你完全可以使用 ShowDoc来编写一些工具的说明书',
			
 
				+  section_description4_2:
			
 
				+    '也可以编写一些技术规范说明文档以供团队查阅',
			
 
				   section_title5: '团队协作',
			
 
				   section_description5: '团队权限管理机制让团队良好地协同编写文档',
			
 
				-  section_title6: '免费开源',
			
 
				-  section_description6:
			
 
				-    'ShowDoc提供免费开源的版本<br>你可以选择将ShowDoc部署到你的服务器',
			
 
				-  section_title7: '在线托管',
			
 
				-  section_description7:
			
 
				-    'www.showdoc.cc 提供安全稳定的在线文档托管服务<br>你可以放心地选择托管你的文档数据在云端',
			
 
				-  section_title8: '立即体验',
			
 
				-  section_description8: '超过10000+互联网团队正在使用ShowDoc',
			
 
				+  section_title6: '文档自动化',
			
 
				+  section_description6_1:
			
 
				+    '可从代码注释中自动生成文档',
			
 
				+  section_description6_2:
			
 
				+    '搭配的RunApi客户端，可调试接口和自动生成文档',
			
 
				+  section_title7: '免费开源',
			
 
				+  section_description7_1:
			
 
				+    'ShowDoc提供免费开源的版本',
			
 
				+  section_description7_2:
			
 
				+    '你可以选择将ShowDoc部署到你的服务器',
			
 
				+  section_title8: '在线托管',
			
 
				+  section_description8_1:
			
 
				+    'www.showdoc.com.cn 安全稳定的在线文档托管服务',
			
 
				+  section_description8_2:
			
 
				+    '你可以放心地选择托管你的文档数据在云端',
			
 
				+  section_title9: '立即体验',
			
 
				+  section_description9: '超过100000+互联网团队正在使用ShowDoc',
			
 
				 
			
 
				   // user
			
 
				   login: '登录',
			
--- a/web_src/src/components/Index.vue
+++ b/web_src/src/components/Index.vue
@@ -1,106 +1,183 @@
 
				 <template>
			
 
				-  <div class="hello">
			
 
				-    <div class="block">
			
 
				-      <div class="row header">
			
 
				-        <div class="right pull-right">
			
 
				-          <ul class="inline pull-right">
			
 
				+  <div class="body">
			
 
				+    <!--header-->
			
 
				+    <div class="header">
			
 
				+      <div class="header-wrap">
			
 
				+        <div class="logo">
			
 
				+          <a href="/">
			
 
				+            <img src="static/imgs/Logo.png" />
			
 
				+          </a>
			
 
				+        </div>
			
 
				+        <input type="checkbox" name id="mobile-menu-toggle" value />
			
 
				+        <label class="gh" for="mobile-menu-toggle">
			
 
				+          <span></span>
			
 
				+        </label>
			
 
				+        <div class="nav">
			
 
				+          <ul>
			
 
				+            <li>
			
 
				+              <router-link :to="link">{{link_text}}</router-link>
			
 
				+            </li>
			
 
				             <li>
			
 
				-              <router-link :to="link">{{link_text}}</router-link>&nbsp;&nbsp;&nbsp;
			
 
				-              <a
			
 
				-                target="_blank"
			
 
				-                v-if="lang =='zh-cn'"
			
 
				-                href="https://www.showdoc.cc/clients"
			
 
				-              >客户端</a>
			
 
				+              <a target="_blank" v-if="lang =='zh-cn'" href="https://www.showdoc.cc/clients">客户端</a>
			
 
				             </li>
			
 
				           </ul>
			
 
				         </div>
			
 
				       </div>
			
 
				+    </div>
			
 
				 
			
 
				-      <el-carousel :height="height" :autoplay="false" arrow="always">
			
 
				-        <el-carousel-item style="background-color: #1bbc9b;">
			
 
				-          <div class="slide">
			
 
				-            <img src="static/logo/b_64.png" alt />
			
 
				-            <h2>{{$t("section_title1")}}</h2>
			
 
				+    <div class="hbanner">
			
 
				+      <div class="wrapper">
			
 
				+        <div class="hbanner-txt">
			
 
				+          <h2>
			
 
				+            {{$t('section_description1_1')}}
			
 
				+            <br />
			
 
				+            <font class="f-blue">{{$t('section_description1_2')}}</font>
			
 
				+          </h2>
			
 
				+          <div class="btns">
			
 
				+            <a href="https://www.showdoc.cc/demo" target="_blank" class="btn on">{{$t("demo")}}</a>
			
 
				+            <a href="https://www.showdoc.cc/help" target="_blank" class="btn">{{$t("more")}}</a>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+        <div class="hbanner-imgs"></div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <div class="hrow hrow1">
			
 
				+      <div class="wrapper">
			
 
				+        <div class="img fl">
			
 
				+          <img src="static/imgs/home2.png" />
			
 
				+          <div class="box">
			
 
				+            <img src="static/imgs/home2-img.png" />
			
 
				+          </div>
			
 
				+        </div>
			
 
				+        <div class="txt fr">
			
 
				+          <h2>{{$t("section_title2")}}</h2>
			
 
				+          <div class="desc">
			
 
				             <p>
			
 
				-              <span v-html="$t('section_description1')"></span>
			
 
				+              <img src="static/imgs/Vector.png" />
			
 
				+              {{$t("section_description2_1")}}
			
 
				             </p>
			
 
				             <p>
			
 
				-              <a class="el-button" href="https://www.showdoc.cc/demo" target="_blank">{{$t("demo")}}</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			
 
				-              <a
			
 
				-                class="el-button"
			
 
				-                href="https://www.showdoc.cc/help"
			
 
				-                target="_blank"
			
 
				-              >{{$t("help")}}&nbsp;</a>
			
 
				+              <img src="static/imgs/Vector.png" />
			
 
				+              {{$t("section_description2_2")}}
			
 
				             </p>
			
 
				           </div>
			
 
				-        </el-carousel-item>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				 
			
 
				-        <el-carousel-item style="background-color: #2C606A;">
			
 
				-          <div class="slide">
			
 
				-            <h2>{{$t("section_title2")}}</h2>
			
 
				+    <div class="hrow hrow2">
			
 
				+      <div class="wrapper">
			
 
				+        <div class="img fr">
			
 
				+          <img src="static/imgs/home3.png" />
			
 
				+        </div>
			
 
				+        <div class="txt fl">
			
 
				+          <h2>{{$t("section_title3")}}</h2>
			
 
				+          <div class="desc">
			
 
				             <p>
			
 
				-              <span v-html="$t('section_description2')"></span>
			
 
				+              <img src="static/imgs/Vector1.png" />
			
 
				+              {{$t("section_description3_1")}}
			
 
				             </p>
			
 
				-          </div>
			
 
				-        </el-carousel-item>
			
 
				-
			
 
				-        <el-carousel-item style="background-color: #f90;">
			
 
				-          <div class="slide">
			
 
				-            <h2>{{$t("section_title3")}}</h2>
			
 
				             <p>
			
 
				-              <span v-html="$t('section_description3')"></span>
			
 
				+              <img src="static/imgs/Vector1.png" />
			
 
				+              {{$t("section_description3_2")}}
			
 
				             </p>
			
 
				           </div>
			
 
				-        </el-carousel-item>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				 
			
 
				-        <el-carousel-item style="background-color: #7CBD9D;">
			
 
				-          <div class="slide">
			
 
				-            <h2>{{$t("section_title4")}}</h2>
			
 
				+    <div class="hrow hrow3">
			
 
				+      <div class="wrapper">
			
 
				+        <div class="img fl">
			
 
				+          <img src="static/imgs/home4.png" />
			
 
				+        </div>
			
 
				+        <div class="txt fr">
			
 
				+          <h2>{{$t("section_title4")}}</h2>
			
 
				+          <div class="desc">
			
 
				             <p>
			
 
				-              <span v-html="$t('section_description4')"></span>
			
 
				+              <img src="static/imgs/Vector.png" />
			
 
				+              {{$t("section_description4_1")}}
			
 
				             </p>
			
 
				-          </div>
			
 
				-        </el-carousel-item>
			
 
				-
			
 
				-        <el-carousel-item style="background-color: #A77DC2;">
			
 
				-          <div class="slide">
			
 
				-            <h2>{{$t("section_title5")}}</h2>
			
 
				             <p>
			
 
				-              <span v-html="$t('section_description5')"></span>
			
 
				+              <img src="static/imgs/Vector.png" />
			
 
				+              {{$t("section_description4_2")}}
			
 
				             </p>
			
 
				           </div>
			
 
				-        </el-carousel-item>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				 
			
 
				-        <el-carousel-item style="background-color: #85CE92;">
			
 
				-          <div class="slide">
			
 
				-            <h2>{{$t("section_title6")}}</h2>
			
 
				-            <p>
			
 
				-              <span v-html="$t('section_description6')"></span>
			
 
				-            </p>
			
 
				+    <div class="hrow hrow4">
			
 
				+      <div class="wrapper">
			
 
				+        <div class="img fr">
			
 
				+          <img src="static/imgs/home5.png" />
			
 
				+        </div>
			
 
				+        <div class="txt fl">
			
 
				+          <h2>{{$t("section_title5")}}</h2>
			
 
				+          <div class="desc">
			
 
				+            <p>{{$t("section_description5")}}</p>
			
 
				           </div>
			
 
				-        </el-carousel-item>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				 
			
 
				-        <el-carousel-item style="background-color: #4BBFC3;">
			
 
				-          <div class="slide">
			
 
				-            <h2>{{$t("section_title7")}}</h2>
			
 
				+    <div class="hrow hrow5">
			
 
				+      <div class="wrapper">
			
 
				+        <div class="img fl">
			
 
				+          <img src="static/imgs/home6.png" />
			
 
				+        </div>
			
 
				+        <div class="txt fr">
			
 
				+          <h2>{{$t("section_title6")}}</h2>
			
 
				+          <div class="desc">
			
 
				             <p>
			
 
				-              <span v-html="$t('section_description7')"></span>
			
 
				+              <img src="static/imgs/Vector1.png" />
			
 
				+              {{$t("section_description6_1")}}
			
 
				             </p>
			
 
				-          </div>
			
 
				-        </el-carousel-item>
			
 
				-
			
 
				-        <el-carousel-item style="background-color: #1bbc9b;">
			
 
				-          <div class="slide">
			
 
				-            <h2></h2>
			
 
				-            <p>{{$t("section_description8")}}</p>
			
 
				             <p>
			
 
				-              <el-button>
			
 
				-                <router-link to="/user/login">{{$t("section_title8")}}</router-link>
			
 
				-              </el-button>
			
 
				+              <img src="static/imgs/Vector1.png" />
			
 
				+              {{$t("section_description6_2")}}
			
 
				             </p>
			
 
				           </div>
			
 
				-        </el-carousel-item>
			
 
				-      </el-carousel>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <div class="hrow hrow6">
			
 
				+      <div class="wrapper">
			
 
				+        <div class="img fr">
			
 
				+          <img src="static/imgs/home7.png" />
			
 
				+        </div>
			
 
				+        <div class="txt fl">
			
 
				+          <h2>{{$t("section_title7")}}</h2>
			
 
				+          <div class="desc">
			
 
				+            <p>{{$t("section_description7_1")}}</p>
			
 
				+            <p>{{$t("section_description7_2")}}</p>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+
			
 
				+    <div class="hrow hrow7">
			
 
				+      <div class="wrapper">
			
 
				+        <div class="img fl">
			
 
				+          <img src="static/imgs/home8.png" />
			
 
				+        </div>
			
 
				+        <div class="txt fr">
			
 
				+          <h2>{{$t("section_title8")}}</h2>
			
 
				+          <div class="desc">
			
 
				+            <p>{{$t("section_description8_1")}}</p>
			
 
				+            <p>{{$t("section_description8_2")}}</p>
			
 
				+          </div>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+    <div class="hfoot">
			
 
				+      <div class="wrapper">
			
 
				+        <h2>{{$t("section_description9")}}</h2>
			
 
				+        <router-link to="/user/login" class="btn">{{$t("section_title9")}}</router-link>
			
 
				+      </div>
			
 
				+      <div class="copyright">
			
 
				+        <a href="http://www.beian.miit.gov.cn/"></a>
			
 
				+      </div>
			
 
				     </div>
			
 
				   </div>
			
 
				 </template>
			
@@ -167,45 +244,6 @@ export default {
 
				 </script>
			
 
				 
			
 
				 <!-- Add "scoped" attribute to limit CSS to this component only -->
			
 
				-<style scoped>
			
 
				-.el-carousel__item {
			
 
				-  text-align: center;
			
 
				-  font: 25px 'Microsoft Yahei';
			
 
				-  color: #fff;
			
 
				-}
			
 
				-
			
 
				-.header {
			
 
				-  padding-right: 50px;
			
 
				-  padding-top: 30px;
			
 
				-  font-size: 18px;
			
 
				-  position: fixed;
			
 
				-  right: 0;
			
 
				-  left: 0;
			
 
				-  z-index: 1030;
			
 
				-  margin-bottom: 0;
			
 
				-}
			
 
				-.header a {
			
 
				-  color: white;
			
 
				-  font-size: 12px;
			
 
				-  font-weight: bold;
			
 
				-}
			
 
				-.slide {
			
 
				-  width: 100%;
			
 
				-  max-width: 700px;
			
 
				-  position: absolute;
			
 
				-  top: 50%;
			
 
				-  left: 50%;
			
 
				-  transform: translate(-50%, -50%);
			
 
				-  padding-top: 0px;
			
 
				-  padding-left: 15px;
			
 
				-  padding-right: 15px;
			
 
				-  padding-bottom: 0px;
			
 
				-  box-sizing: border-box;
			
 
				-}
			
 
				-
			
 
				-@media only screen and (max-width: 800px) {
			
 
				-  .slide p {
			
 
				-    font-size: 14px;
			
 
				-  }
			
 
				-}
			
 
				-</style>
			
 
				+<style scoped src="@/../static/css/qietu.css"></style>
			
 
				+<style scoped src="@/../static/css/style.css"></style>
			
 
				+<style scoped src="@/../static/css/responsive.css"></style>
			
--- a/web_src/static/css/qietu.css
+++ b/web_src/static/css/qietu.css
@@ -0,0 +1,162 @@
 
				+
			
 
				+/*reset*/
			
 
				+ html{-webkit-text-size-adjust:none; /*解决chrome浏览器下字体不能小于12px*/}
			
 
				+ body{ color:#000000; font-family:Verdana, Arial, Helvetica, sans-serif;}
			
 
				+a{outline:none; text-decoration:none;} a:hover{ text-decoration:underline;}
			
 
				+html{zoom:1;}html *{outline:0;zoom:1;} html button::-moz-focus-inner{border-color:transparent!important;}
			
 
				+body{overflow-x: hidden; font-size:12px;} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;} table{/*border-collapse:collapse;border-spacing:0;*/} fieldset,a img{border:0;} address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;} li{list-style:none;} caption,th{text-align:left;} h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;} q:before,q:after{content:'';}
			
 
				+input[type="submit"], input[type="reset"], input[type="button"], button { -webkit-appearance: none; /*去掉苹果的默认UI来渲染按钮*/} em,i{ font-style:normal;}
			
 
				+
			
 
				+
			
 
				+
			
 
				+/*common*/
			
 
				+.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden; }.clearfix {display:block;}.clear{ clear:both;}
			
 
				+.colwrapper { overflow:hidden; zoom:1 /*for ie*/; margin:5px auto; }
			
 
				+.strong{ font-weight: bold;} .left{ float: left;} .right{ float: right;} .center{ margin:0 auto; text-align:center;}
			
 
				+.show{ display:block; visibility:visible;}.hide{ display: none; visibility:hidden;}
			
 
				+.block{ display:block;} .inline{ display:inline;}
			
 
				+.break{ word-wrap:break-word;overflow:hidden; /*word-break:break-all;*/}
			
 
				+
			
 
				+.tal{ text-align:left} .tar{ text-align:right;}
			
 
				+
			
 
				+/*文字两侧对齐*/
			
 
				+.justify {
			
 
				+	text-align:justify;
			
 
				+	text-justify:distribute-all-lines;/*ie6-8*/
			
 
				+	text-align-last:justify;/* ie9*/
			
 
				+	-moz-text-align-last:justify;/*ff*/
			
 
				+	-webkit-text-align-last:justify;/*chrome 20+*/
			
 
				+}
			
 
				+
			
 
				+.toe{
			
 
				+	/*超出省略号*/
			
 
				+	 word-break:keep-all;
			
 
				+white-space:nowrap;
			
 
				+overflow:hidden;
			
 
				+text-overflow:ellipsis;
			
 
				+}
			
 
				+@media screen and (-webkit-min-device-pixel-ratio:0){/* chrome*/
			
 
				+	.justify:after{
			
 
				+		content:".";
			
 
				+		display: inline-block;
			
 
				+		width:100%;
			
 
				+		overflow:hidden;
			
 
				+		height:0;
			
 
				+	}
			
 
				+}
			
 
				+
			
 
				+  a{ color:inherit; text-decoration: none;}
			
 
				+  a:hover{ color:#3e6ed4; text-decoration: none;}
			
 
				+
			
 
				+body{font-family: "Microsoft YaHei",sans-serif;}
			
 
				+
			
 
				+.css3{
			
 
				+	/*transition: all 0.3s ease-in-out 0s;*/
			
 
				+
			
 
				+	-webkit-transform:translate3d(0, -20px, 0);
			
 
				+	-ms-transform:translate3d(0, -20px, 0);
			
 
				+	transform:translate3d(0, -20px, 0);
			
 
				+
			
 
				+	-webkit-transition-property:opacity, -webkit-transform;
			
 
				+	transition-property:opacity, transform;
			
 
				+	-webkit-transition-duration:1000ms;
			
 
				+	transition-duration:1000ms;
			
 
				+	-webkit-transition-timing-function:cubic-bezier(0.25, 0.46, 0.33, 0.98);
			
 
				+	transition-timing-function:cubic-bezier(0.25, 0.46, 0.33, 0.98);
			
 
				+
			
 
				+	-webkit-transition-delay:800ms;
			
 
				+	transition-delay:800ms
			
 
				+}
			
 
				+.css3.animated{
			
 
				+	-webkit-transform:translate3d(0, 0, 0);
			
 
				+	-ms-transform:translate3d(0, 0, 0);
			
 
				+	transform:translate3d(0, 0, 0);
			
 
				+}
			
 
				+@media screen and (max-width: 650px) {
			
 
				+
			
 
				+  }
			
 
				+
			
 
				+  @media screen and (max-width: 480px) {
			
 
				+
			
 
				+  }
			
 
				+
			
 
				+
			
 
				+/*手机下汉堡菜单*/
			
 
				+.gh {
			
 
				+
			
 
				+	height:34px;
			
 
				+	width:34px;
			
 
				+	margin-right:30px;
			
 
				+	position:absolute;
			
 
				+	right: 0; top: 20px;
			
 
				+	transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-webkit-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-ms-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	cursor:pointer;
			
 
				+	display: none;
			
 
				+}
			
 
				+.gh span {
			
 
				+	background-color: #fff;
			
 
				+	display: block;
			
 
				+	height: 2px;
			
 
				+	margin-top: -2px;
			
 
				+	position: relative;
			
 
				+	top: 50%;
			
 
				+	transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	width: 100%;
			
 
				+}
			
 
				+
			
 
				+.gh span:after, .gh span:before {
			
 
				+	background-color: #fff;
			
 
				+	content: "";
			
 
				+	display: block;
			
 
				+	height: 2px;
			
 
				+	left: 0;
			
 
				+	position: absolute;
			
 
				+	transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
			
 
				+	width:100%;
			
 
				+}
			
 
				+.gh span:after {
			
 
				+	top:10px;
			
 
				+}
			
 
				+.gh span:before {
			
 
				+	top:-10px;
			
 
				+}
			
 
				+#mobile-menu-toggle{
			
 
				+	display: none;
			
 
				+}
			
 
				+#mobile-menu-toggle:checked + .gh span:after,
			
 
				+#mobile-menu-toggle:checked + .gh span:before {
			
 
				+	top: 0;
			
 
				+}
			
 
				+#mobile-menu-toggle:checked + .gh span:before {
			
 
				+	transform: translateY(0px) rotate(-45deg);
			
 
				+	-webkit-transform: translateY(0px) rotate(-45deg);
			
 
				+	-ms-transform: translateY(0px) rotate(-45deg);
			
 
				+}
			
 
				+#mobile-menu-toggle:checked + .gh span:after {
			
 
				+	transform: translateY(0px) rotate(45deg);
			
 
				+	-webkit-transform: translateY(0px) rotate(45deg);
			
 
				+	-ms-transform: translateY(0px) rotate(45deg);
			
 
				+}
			
 
				+#mobile-menu-toggle:checked + .gh span {
			
 
				+	background-color: transparent !important;
			
 
				+}
			
 
				+#mobile-menu-toggle:checked + .gh + .nav{
			
 
				+	max-height: 1000px;
			
 
				+}
			
 
				+.nav{
			
 
				+
			
 
				+}
			
 
				+
			
 
				+.gh+ .nav{
			
 
				+	/*height: auto;
			
 
				+		background: #2f6ea2;
			
 
				+		overflow: hidden;
			
 
				+		transition: 0.4s;
			
 
				+		padding: 0; max-height: 0;*/
			
 
				+}
			
--- a/web_src/static/css/responsive.css
+++ b/web_src/static/css/responsive.css
@@ -0,0 +1,227 @@
 
				+
			
 
				+* {
			
 
				+    margin: 0;
			
 
				+    padding: 0;
			
 
				+    -webkit-appearance: none; /*去掉浏览器默认样式*/
			
 
				+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
			
 
				+    -webkit-touch-callout: none;
			
 
				+    box-sizing: border-box;
			
 
				+}
			
 
				+
			
 
				+body,.body {
			
 
				+
			
 
				+    -webkit-text-size-adjust: 100%; /*关闭自动调整字体*/
			
 
				+    -webkit-overflow-scrolling: touch;
			
 
				+    overflow-scrolling: touch;
			
 
				+}
			
 
				+
			
 
				+
			
 
				+/*pad*/
			
 
				+img{
			
 
				+	max-width:100%;
			
 
				+}
			
 
				+
			
 
				+input[type="submit"], input[type="reset"], input[type="button"], button { -webkit-appearance: none; /*去掉苹果的默认UI来渲染按钮*/}
			
 
				+@media only screen and (max-width:1480px) {
			
 
				+	.wrapper{
			
 
				+    		width: 1240px;
			
 
				+    	}
			
 
				+    	.hbanner .wrapper{
			
 
				+    		background-size: 650px auto;
			
 
				+    	}
			
 
				+    	.hrow .txt h2{
			
 
				+    		font-size: 36px;
			
 
				+    	}
			
 
				+    	.hrow .txt p{
			
 
				+    		font-size: 18px;
			
 
				+    	}
			
 
				+
			
 
				+}
			
 
				+/* 电脑小屏--md */
			
 
				+    @media screen and (max-width:1200px){
			
 
				+    	.wrapper{
			
 
				+    		width: 1170px;
			
 
				+    	}
			
 
				+
			
 
				+    	/*价格*/
			
 
				+    	.mprice-main .wrapper{
			
 
				+	padding-left: 150px;
			
 
				+	position: relative;
			
 
				+	margin-right: 20px;
			
 
				+
			
 
				+}
			
 
				+.mprice-main{
			
 
				+	background-size: cover;
			
 
				+	padding-bottom: 40px;
			
 
				+	padding-top: 100px;
			
 
				+}
			
 
				+.mprice-main .itemwrap{
			
 
				+	white-space: nowrap;
			
 
				+	overflow-x: scroll;
			
 
				+	padding-top: 80px;
			
 
				+}
			
 
				+.mprice-main .item{
			
 
				+	float: none; display: inline-block;
			
 
				+	vertical-align: top;
			
 
				+	width: 200px;
			
 
				+}
			
 
				+.mprice-main .item ul.tit{
			
 
				+	padding-left: 20px;
			
 
				+}
			
 
				+.mprice-main .itemtit{
			
 
				+	position: absolute; left: 0; top: 0;
			
 
				+}
			
 
				+.mprice-main .item .btn a{
			
 
				+	width: 120px; height: 45px; line-height: 45px; font-size: 14px;
			
 
				+}
			
 
				+.mprice-explain{
			
 
				+	padding: 60px 0;
			
 
				+}
			
 
				+.mprice-explain .wrapper{
			
 
				+	padding: 0 20px;
			
 
				+}
			
 
				+
			
 
				+    }
			
 
				+    /* 平板--sm */
			
 
				+    @media screen and (max-width:992px) {
			
 
				+    	.gh{
			
 
				+		display: block;
			
 
				+	}
			
 
				+	.gh+ .nav{
			
 
				+	height: auto;
			
 
				+		background: #fff;
			
 
				+		overflow: hidden;
			
 
				+		transition: 0.4s;
			
 
				+		padding: 0; max-height: 0;
			
 
				+		margin-right: 0;
			
 
				+		float: none;
			
 
				+		width: 100%;
			
 
				+		text-align: center;
			
 
				+
			
 
				+}
			
 
				+.header .nav ul{
			
 
				+	padding: 20px 0;
			
 
				+}
			
 
				+.header .nav li{
			
 
				+	display: block;
			
 
				+	margin-left: 0;
			
 
				+}
			
 
				+.nav a{
			
 
				+	color: #000; display: block; padding: 10px 0;
			
 
				+}
			
 
				+.header{
			
 
				+	/*margin-top: 20px;*/
			
 
				+	padding-top: 20px;
			
 
				+}
			
 
				+.header .logo{
			
 
				+	margin-left: 20px;
			
 
				+}
			
 
				+	.wrapper{
			
 
				+		width: auto;
			
 
				+	}
			
 
				+	.hbanner .wrapper{
			
 
				+		background-size: 300px auto;
			
 
				+		background-position: center 100px;
			
 
				+		padding-top: 400px;
			
 
				+		height: auto;
			
 
				+		padding-bottom: 100px;
			
 
				+	}
			
 
				+	.hbanner-txt .btns a{
			
 
				+		width:auto; min-width: 120px; height: 45px; line-height: 45px;
			
 
				+	}
			
 
				+	.hbanner-txt{
			
 
				+		padding-left: 40px;
			
 
				+		/*text-align: center;*/
			
 
				+	}
			
 
				+	.hbanner-txt h2{
			
 
				+		font-size: 24px;
			
 
				+	}
			
 
				+	.hbanner-txt .list li{
			
 
				+		margin-bottom: 15px;
			
 
				+	}
			
 
				+	.hrow .img{
			
 
				+		width: auto; float: none; text-align: center;
			
 
				+		padding-top: 0;
			
 
				+	}
			
 
				+	.hrow{
			
 
				+		height: auto !important;
			
 
				+		padding-bottom: 100px;
			
 
				+		padding-top: 100px;
			
 
				+	}
			
 
				+	.hrow .txt{
			
 
				+		width: auto; float: none; padding-top: 40px;
			
 
				+	}
			
 
				+	.hrow .img>img{
			
 
				+		max-width: 220px;
			
 
				+	}
			
 
				+	.hrow .txt h2{
			
 
				+		font-size: 24px; margin-bottom: 20px;
			
 
				+	}
			
 
				+	.hrow .txt p{
			
 
				+		font-size: 14px; padding-bottom: 10px;
			
 
				+	}
			
 
				+
			
 
				+	.hfoot{
			
 
				+		padding-top: 100px;
			
 
				+		height: auto;
			
 
				+		padding-bottom: 120px;
			
 
				+		background-size: cover;
			
 
				+	}
			
 
				+	.hfoot h2{
			
 
				+		font-size: 24px;
			
 
				+	}
			
 
				+	.hfoot h2 br{
			
 
				+	display: block;
			
 
				+}
			
 
				+.hfoot .btn{
			
 
				+	width:auto; min-width: 120px; height: 45px; line-height: 45px;
			
 
				+}
			
 
				+
			
 
				+/*下载*/
			
 
				+.downpage{
			
 
				+	width: auto; margin-left: 20px; margin-right: 20px;
			
 
				+	margin-top: 100px;
			
 
				+	margin-bottom: 100px;
			
 
				+}
			
 
				+.downlist{
			
 
				+	padding: 40px 0;
			
 
				+}
			
 
				+.downlist .body{
			
 
				+	margin-top: 40px;
			
 
				+}
			
 
				+.downlist .body li{
			
 
				+	display: block; margin-bottom: 40px;
			
 
				+}
			
 
				+.downlist .body .btn a{
			
 
				+	width: auto; min-width: 120px; height: 45px; line-height: 45px; font-size: 14px;
			
 
				+}
			
 
				+
			
 
				+/*注册*/
			
 
				+.form-box{
			
 
				+	width: auto; margin-left: 20px; margin-right: 20px;
			
 
				+	margin-top: 150px;
			
 
				+	margin-bottom: 100px;
			
 
				+}
			
 
				+.form{
			
 
				+	padding: 20px;
			
 
				+	padding-top: 70px;
			
 
				+}
			
 
				+.form-btns button{
			
 
				+	height: 45px; line-height: 45px; font-size: 14px;
			
 
				+}
			
 
				+.form-list .text{
			
 
				+	height: 45px;
			
 
				+}
			
 
				+.form-list .textcode + img{
			
 
				+	height: 45px; width: 100px;
			
 
				+}
			
 
				+
			
 
				+/*价格*/
			
 
				+
			
 
				+
			
 
				+    }
			
 
				+    @media screen and (max-width:768px){
			
 
				+    	/*.wrapper{
			
 
				+    		width: 750px;
			
 
				+    	}*/
			
 
				+    }
			
--- a/web_src/static/css/style.css
+++ b/web_src/static/css/style.css
@@ -0,0 +1,534 @@
 
				+*{
			
 
				+	box-sizing: border-box;
			
 
				+}
			
 
				+.body,body,select,input,view,text,button,textarea{
			
 
				+     font-family: 'PingFang SC','microsoft yahei',arial,'helvetica neue','hiragino sans gb',sans-serif;
			
 
				+}
			
 
				+body,.body{
			
 
				+	font-size: 14px; color: #fff; background-color: #111111;
			
 
				+	overflow-x: hidden;line-height: 1.6;
			
 
				+}
			
 
				+a{
			
 
				+	color: inherit;
			
 
				+}
			
 
				+a:hover{
			
 
				+	color: inherit;
			
 
				+}
			
 
				+img{
			
 
				+	max-width: 100%;
			
 
				+}
			
 
				+
			
 
				+.clearfix:after{
			
 
				+	content: "";display: table; clear: both; height: 0; visibility: hidden;
			
 
				+}
			
 
				+.fl{
			
 
				+	float: left;
			
 
				+}
			
 
				+.fr{
			
 
				+	float: right;
			
 
				+}
			
 
				+
			
 
				+/*header*/
			
 
				+.header{
			
 
				+	/*margin-top: 50px; position: absolute;*/ left: 0; right: 0; top: 0;
			
 
				+
			
 
				+	/**/
			
 
				+	background: #111111;
			
 
				+	position: fixed;
			
 
				+	padding-top: 50px;
			
 
				+	padding-bottom: 20px;
			
 
				+	z-index: 99;
			
 
				+}
			
 
				+
			
 
				+.header .logo{
			
 
				+	margin-left: 55px; float: left;
			
 
				+}
			
 
				+.header .nav{
			
 
				+	float: right; margin-right: 60px;
			
 
				+	font-weight: 400;
			
 
				+}
			
 
				+.header .nav li{
			
 
				+	margin-left: 55px; display: inline-block;vertical-align: middle;font-size: 16px;
			
 
				+}
			
 
				+.header .nav li.active a,
			
 
				+.header .nav li a:hover{
			
 
				+	color: #369FFF;
			
 
				+}
			
 
				+.form-box{
			
 
				+	width: 400px; margin: 200px auto 170px;
			
 
				+}
			
 
				+.form-tit{
			
 
				+	text-align: center;font-size: 22px; margin-bottom: 20px;
			
 
				+}
			
 
				+.form{
			
 
				+	background: #202020;border-radius: 4px; padding: 55px 55px 55px 55px;
			
 
				+	position: relative;
			
 
				+}
			
 
				+.form-err{
			
 
				+	background: #FF6A6A;
			
 
				+border-radius: 4px 4px 0 0;
			
 
				+position: absolute; left: 0; right: 0; top: 0;
			
 
				+ padding: 10px;
			
 
				+ font-style: normal;
			
 
				+font-weight: normal;
			
 
				+font-size: 12px;
			
 
				+text-align: center;
			
 
				+}
			
 
				+.form-list li{
			
 
				+	margin-bottom: 15px;
			
 
				+}
			
 
				+
			
 
				+.form-list .text{
			
 
				+	width: 100%; height: 52px;
			
 
				+	background: #111111;
			
 
				+border-radius: 4px; border: 0; font-size: 14px;color: #989898; padding: 0 15px;
			
 
				+border: #111111 solid 1px;
			
 
				+}
			
 
				+.form-list .text-err{
			
 
				+	border-color: #FF6A6A;
			
 
				+}
			
 
				+.form-list .textcode{
			
 
				+	width: 160px;
			
 
				+}
			
 
				+.form-list .textcode + img{
			
 
				+	vertical-align: middle;
			
 
				+	width: 116px; height: 52px;
			
 
				+}
			
 
				+.form-list .text:focus{
			
 
				+	border: #369FFF solid 1px;
			
 
				+}
			
 
				+.form-list a:hover{
			
 
				+	color: #369FFF;
			
 
				+}
			
 
				+.form-btns{
			
 
				+	margin-top: 50px;text-align: center;
			
 
				+}
			
 
				+.form-btns li+li{
			
 
				+	margin-top: 10px;
			
 
				+}
			
 
				+.form-btns .btn{
			
 
				+	width: 100%; height: 55px; background: #FFFFFF; font-size: 16px; color: #111111;
			
 
				+	border: 1px solid #FFFFFF;
			
 
				+box-sizing: border-box;
			
 
				+border-radius: 4px;
			
 
				+cursor: pointer;
			
 
				+display: inline-block;
			
 
				+line-height: 55px;
			
 
				+}
			
 
				+.form-btns .btn:hover{
			
 
				+	background: #369FFF !important;
			
 
				+	border-color: #369FFF !important;
			
 
				+	color: #fff !important;
			
 
				+}
			
 
				+.form-btns .btn.btn1{
			
 
				+	background: transparent; color: #fff;
			
 
				+}
			
 
				+.form-other{
			
 
				+	text-align: center;margin-top: 15px;
			
 
				+}
			
 
				+.form-other .hd{
			
 
				+	color: #4E4E4E;
			
 
				+}
			
 
				+.form-other .bd{
			
 
				+	margin-top: 15px;
			
 
				+}
			
 
				+
			
 
				+/*首页*/
			
 
				+.wrapper{
			
 
				+	width: 1440px; margin: 0 auto;
			
 
				+
			
 
				+}
			
 
				+.hbanner{
			
 
				+
			
 
				+}
			
 
				+.hbanner .wrapper{
			
 
				+	background: url(../imgs/home1.png) no-repeat right center;
			
 
				+	height: 940px;
			
 
				+	padding-top: 305px;
			
 
				+}
			
 
				+.hbanner-txt{
			
 
				+	padding-left: 155px;
			
 
				+}
			
 
				+.hbanner-txt h2{
			
 
				+	font-size: 40px;
			
 
				+line-height: 160%;
			
 
				+color: #fff;
			
 
				+font-weight: bold;
			
 
				+margin-bottom: 55px;
			
 
				+}
			
 
				+.hbanner-txt h2 font{
			
 
				+	color: #369FFF;
			
 
				+}
			
 
				+.hbanner-txt .list{
			
 
				+	font-size: 14px;
			
 
				+line-height: 20px;
			
 
				+}
			
 
				+.hbanner-txt .list li{
			
 
				+	margin-bottom: 24px;
			
 
				+}
			
 
				+.hbanner-txt .list li:last-child{
			
 
				+	margin-bottom: 0;
			
 
				+}
			
 
				+.hbanner-txt .list .num{
			
 
				+	background: #333333;
			
 
				+border-radius: 1px;
			
 
				+margin-left: 5px;
			
 
				+padding: 0 3px;
			
 
				+font-family: 'Barlow-Regular';
			
 
				+}
			
 
				+.hbanner-txt .btns{
			
 
				+	margin-top: 60px;
			
 
				+}
			
 
				+.hbanner-txt .btns a{
			
 
				+	width: 130px;
			
 
				+height: 55px;
			
 
				+line-height: 55px;
			
 
				+text-align: center;
			
 
				+display: inline-block;
			
 
				+border: 1px solid #FFFFFF;
			
 
				+box-sizing: border-box;
			
 
				+border-radius: 4px;
			
 
				+margin-right: 24px;
			
 
				+/*transition: 0.4s;*/
			
 
				+}
			
 
				+.hbanner-txt .btns a:hover{
			
 
				+	background: #369FFF !important;
			
 
				+	color: #fff !important;
			
 
				+	border-color: #369FFF;
			
 
				+}
			
 
				+.hbanner-txt  .btns a.on{
			
 
				+	color: #111111;
			
 
				+	background: #fff;
			
 
				+}
			
 
				+
			
 
				+.hrow{
			
 
				+	height: 634px;
			
 
				+}
			
 
				+.hrow .wrapper{
			
 
				+	/*overflow: hidden;*/
			
 
				+	padding: 0 10%;
			
 
				+}
			
 
				+.hrow .fl{
			
 
				+	float: left;
			
 
				+}
			
 
				+.hrow .fr{
			
 
				+	float: right;
			
 
				+}
			
 
				+.hrow .txt{
			
 
				+	/*padding-left: 155px;*/
			
 
				+	padding-top: 210px;
			
 
				+	/*width: 570px;*/
			
 
				+	width: 53%;
			
 
				+}
			
 
				+.hrow .txt h2{
			
 
				+	font-weight: 600;
			
 
				+font-size: 40px;
			
 
				+line-height: 160%;
			
 
				+margin-bottom: 50px;
			
 
				+}
			
 
				+.hrow .txt p{
			
 
				+	font-size: 22px;
			
 
				+line-height: 1.4;
			
 
				+padding-bottom: 30px;
			
 
				+}
			
 
				+.hrow .txt p img{
			
 
				+	margin-right: 13px;
			
 
				+}
			
 
				+.hrow .img{
			
 
				+	/*padding-top: 120px;*/
			
 
				+	padding-top: 110px;
			
 
				+	/*width: 500px;*/
			
 
				+	width: 43%;
			
 
				+}
			
 
				+.hrow1{
			
 
				+	background: #202020;
			
 
				+	height: 634px;
			
 
				+}
			
 
				+.hrow1 .img{
			
 
				+	position: relative;
			
 
				+}
			
 
				+.hrow1 .img> .box{
			
 
				+	position: absolute; left: 0; top: -50px;
			
 
				+}
			
 
				+.hrow1 .img>img{
			
 
				+	position: relative; z-index: 2;
			
 
				+}
			
 
				+.hrow2{
			
 
				+	background: #369FFF;
			
 
				+	height: 634px;
			
 
				+}
			
 
				+.hrow3{
			
 
				+	background: #111111;
			
 
				+	height: 634px;
			
 
				+}
			
 
				+.hrow4{
			
 
				+	background: #202020;
			
 
				+	height: 570px;
			
 
				+}
			
 
				+.hrow5{
			
 
				+	background: #369FFF;
			
 
				+	height: 634px;
			
 
				+}
			
 
				+.hrow6{
			
 
				+	background: #111111;
			
 
				+	height: 617px;
			
 
				+}
			
 
				+.hrow7{
			
 
				+	background: #202020;
			
 
				+	height: 617px;
			
 
				+}
			
 
				+.hfoot{
			
 
				+	height: 594px;
			
 
				+	background: url(../imgs/home9.png) no-repeat center top #fff;
			
 
				+	color: #111111;
			
 
				+	text-align: center;
			
 
				+	padding-top: 280px;
			
 
				+	position: relative;
			
 
				+}
			
 
				+.hfoot h2{
			
 
				+	font-size: 40px;
			
 
				+line-height: 160%;
			
 
				+font-weight: bold;
			
 
				+}
			
 
				+.hfoot h2 br{
			
 
				+	display: none;
			
 
				+}
			
 
				+.hfoot .num{
			
 
				+	background: #DFF0FF;
			
 
				+	color: #369FFF;
			
 
				+	font-weight: bold;
			
 
				+border-radius: 1px;
			
 
				+margin-right: 1px;
			
 
				+padding: 0 6px;
			
 
				+font-family: 'Barlow-Regular';
			
 
				+}
			
 
				+.hfoot .btn{
			
 
				+	display: inline-block;
			
 
				+	width: 130px;
			
 
				+height: 55px;
			
 
				+line-height: 55px;
			
 
				+background: #111111;
			
 
				+border-radius: 4px;
			
 
				+margin-top: 24px;
			
 
				+font-size: 16px;
			
 
				+color: #fff;
			
 
				+/*transition: 0.4s;*/
			
 
				+}
			
 
				+.hfoot .btn:hover{
			
 
				+	background: #369FFF;
			
 
				+}
			
 
				+.hfoot .copyright {
			
 
				+	color: #9C9C9C;
			
 
				+	position: absolute;
			
 
				+	left: 0; right: 0; text-align: center; bottom: 35px;
			
 
				+}
			
 
				+
			
 
				+/*价格*/
			
 
				+.mprice-main{
			
 
				+	background:#111111 url(../imgs/bg1.png) no-repeat center top;
			
 
				+	padding-top: 200px;
			
 
				+	padding-bottom: 210px;
			
 
				+	text-align: center;
			
 
				+}
			
 
				+.mprice-main .wrapper{
			
 
				+	overflow: hidden;
			
 
				+	/*padding-left: 140px;*/
			
 
				+	padding-top: 80px;
			
 
				+
			
 
				+}
			
 
				+.mprice-main .item{
			
 
				+	width: 218px;
			
 
				+/*float: left;*/
			
 
				+display: inline-block;
			
 
				+vertical-align: top;
			
 
				+text-align: center;
			
 
				+margin-right: 24px;
			
 
				+cursor: pointer;
			
 
				+transition: 0.4s;
			
 
				+-webkit-transition: 0.4s;
			
 
				+}
			
 
				+.mprice-main .item:hover{
			
 
				+	transform:translateY(-20px);
			
 
				+	-webkit-transform:translateY(-20px);
			
 
				+}
			
 
				+.mprice-main .itemtit:hover{
			
 
				+	transform:translateY(0);
			
 
				+	-webkit-transform:translateY(0);
			
 
				+}
			
 
				+.mprice-main .item .title{
			
 
				+	font-style: normal;
			
 
				+font-weight: 600;
			
 
				+font-size: 22px;
			
 
				+height: 60px;
			
 
				+}
			
 
				+.mprice-main .itembox{
			
 
				+	background: #202020;
			
 
				+border-radius: 4px;
			
 
				+height: 902px;
			
 
				+padding-top: 46px;
			
 
				+position: relative;
			
 
				+padding-bottom: 130px;
			
 
				+}
			
 
				+.mprice-main .itembox-bgnone{
			
 
				+	background: none;
			
 
				+}
			
 
				+.mprice-main .itembox-border{
			
 
				+	background: #111111;
			
 
				+border: 1px solid #202020;
			
 
				+
			
 
				+}
			
 
				+.mprice-main .itembox-border li{
			
 
				+	border-bottom: #202020 solid 1px;
			
 
				+}
			
 
				+.mprice-main .itembox-highlight{
			
 
				+	background: #369FFF;
			
 
				+}
			
 
				+.mprice-main .item ul{
			
 
				+	padding: 0 25px;
			
 
				+}
			
 
				+.mprice-main .item ul.tit{
			
 
				+	color: #989898;
			
 
				+	text-align: left;
			
 
				+	padding-left: 50px;
			
 
				+}
			
 
				+.mprice-main .item  li{
			
 
				+	padding: 20px 0;
			
 
				+}
			
 
				+.mprice-main .item  li.num{
			
 
				+	height: 90px;
			
 
				+	padding: 0;
			
 
				+	border: none;
			
 
				+	font-family: "Barlow-Regular";
			
 
				+}
			
 
				+.mprice-main .item  li.num big{
			
 
				+	font-size: 40px;
			
 
				+	font-weight: bold;
			
 
				+}
			
 
				+.mprice-main .item .btn{
			
 
				+	position: absolute; left: 0; right: 0; bottom: 35px;
			
 
				+}
			
 
				+.mprice-main .item .btn a{
			
 
				+	width: 130px;
			
 
				+height: 55px;
			
 
				+line-height: 55px;
			
 
				+text-align: center;
			
 
				+border: 1px solid #FFFFFF;
			
 
				+box-sizing: border-box;
			
 
				+border-radius: 4px;
			
 
				+display: inline-block;
			
 
				+}
			
 
				+.mprice-main .item .btn a:hover{
			
 
				+	background: #369FFF;
			
 
				+	border-color: #369FFF;
			
 
				+}
			
 
				+.mprice-main .itembox-highlight .btn a{
			
 
				+	color: #369FFF;
			
 
				+	background: #fff;
			
 
				+}
			
 
				+.mprice-main .itembox-highlight .btn a:hover{
			
 
				+	border-color: #fff;
			
 
				+	color: #fff;
			
 
				+}
			
 
				+.mprice-explain{
			
 
				+	background: #202020;
			
 
				+	padding: 60px 0 150px;
			
 
				+
			
 
				+}
			
 
				+.mprice-explain .wrapper{
			
 
				+	padding: 0 155px;
			
 
				+}
			
 
				+.mprice-explain h3{
			
 
				+	font-style: normal;
			
 
				+font-weight: 600;
			
 
				+font-size: 22px;
			
 
				+margin-bottom: 60px;
			
 
				+}
			
 
				+.mprice-explain p{
			
 
				+	margin-bottom: 24px;
			
 
				+	font-size: 14px;
			
 
				+
			
 
				+}
			
 
				+
			
 
				+/*下载*/
			
 
				+.downpage{
			
 
				+
			
 
				+width: 736px;
			
 
				+/*height: 821px;*/
			
 
				+background: #202020;
			
 
				+border-radius: 4px;
			
 
				+margin: 0 auto;
			
 
				+margin-top: 210px;
			
 
				+margin-bottom: 270px;
			
 
				+padding: 24px;
			
 
				+}
			
 
				+.downlist{
			
 
				+	border-bottom: #333333 solid 1px;
			
 
				+	padding: 60px 0;
			
 
				+}
			
 
				+.downlist .head{
			
 
				+	font-style: normal;
			
 
				+font-weight: 600;
			
 
				+font-size: 22px; text-align: center;
			
 
				+}
			
 
				+.downlist .dbody{
			
 
				+	margin-top: 60px;
			
 
				+	text-align: center;
			
 
				+}
			
 
				+.downlist .dbody li{
			
 
				+	display: inline-block; margin: 0 30px;
			
 
				+}
			
 
				+.downlist .dbody .txt{
			
 
				+	font-style: normal;
			
 
				+font-weight: normal;
			
 
				+font-size: 14px;
			
 
				+color: #989898;
			
 
				+margin-top: 15px;
			
 
				+}
			
 
				+.downlist .dbody .btn{
			
 
				+	margin-top: 20px;
			
 
				+}
			
 
				+.downlist .dbody .btn a{
			
 
				+	width: 130px;
			
 
				+height: 55px;
			
 
				+line-height: 55px;
			
 
				+text-align: center;
			
 
				+border: 1px solid #FFFFFF;
			
 
				+box-sizing: border-box;
			
 
				+border-radius: 4px;
			
 
				+display: inline-block;
			
 
				+font-style: normal;
			
 
				+font-weight: 500;
			
 
				+font-size: 16px;
			
 
				+}
			
 
				+.downlist .dbody .btn a.on{
			
 
				+	background: #fff;
			
 
				+	color: #111111;
			
 
				+}
			
 
				+.downlist .dbody .btn a:hover{
			
 
				+	background: #369FFF;
			
 
				+	border-color: #369FFF;
			
 
				+	color: #fff;
			
 
				+}
			
 
				+.downlist .dbody .link{
			
 
				+	margin-top: 20px;
			
 
				+}
			
 
				+.downlist .dbody .link a{
			
 
				+	text-decoration: underline;
			
 
				+	font-style: normal;
			
 
				+font-weight: 500;
			
 
				+font-size: 16px;
			
 
				+}
			
 
				+.downlist + .downlist{
			
 
				+	border: none;
			
 
				+}
			
 
				+.downtip{
			
 
				+	font-style: normal;
			
 
				+font-weight: normal;
			
 
				+font-size: 12px;
			
 
				+line-height: 17px;
			
 
				+color: #666666;
			
 
				+padding-top: 24px;
			
 
				+}
			
 
				+.regbg{
			
 
				+	background:#111111 url(../imgs/regbg.jpg) no-repeat center top;
			
 
				+}
			
--- a/web_src/static/imgs/Android.png
+++ b/web_src/static/imgs/Android.png
--- a/web_src/static/imgs/Auto.png
+++ b/web_src/static/imgs/Auto.png
--- a/web_src/static/imgs/Logo.png
+++ b/web_src/static/imgs/Logo.png
--- a/web_src/static/imgs/Mac.png
+++ b/web_src/static/imgs/Mac.png
--- a/web_src/static/imgs/Server.png
+++ b/web_src/static/imgs/Server.png
--- a/web_src/static/imgs/Vector
+++ b/web_src/static/imgs/Vector
--- a/web_src/static/imgs/Vector.png
+++ b/web_src/static/imgs/Vector.png
--- a/web_src/static/imgs/Vector1.png
+++ b/web_src/static/imgs/Vector1.png
--- a/web_src/static/imgs/Wechat.png
+++ b/web_src/static/imgs/Wechat.png
--- a/web_src/static/imgs/Windows.png
+++ b/web_src/static/imgs/Windows.png
--- a/web_src/static/imgs/bg1.png
+++ b/web_src/static/imgs/bg1.png
--- a/web_src/static/imgs/bg2-1.png
+++ b/web_src/static/imgs/bg2-1.png
--- a/web_src/static/imgs/bg2-2.png
+++ b/web_src/static/imgs/bg2-2.png
--- a/web_src/static/imgs/bg2-3.png
+++ b/web_src/static/imgs/bg2-3.png
--- a/web_src/static/imgs/bg2-4.png
+++ b/web_src/static/imgs/bg2-4.png
--- a/web_src/static/imgs/bg2-5.png
+++ b/web_src/static/imgs/bg2-5.png
--- a/web_src/static/imgs/code.png
+++ b/web_src/static/imgs/code.png
--- a/web_src/static/imgs/home1.png
+++ b/web_src/static/imgs/home1.png
--- a/web_src/static/imgs/home2-1111111.png
+++ b/web_src/static/imgs/home2-1111111.png
--- a/web_src/static/imgs/home2-img.png
+++ b/web_src/static/imgs/home2-img.png
--- a/web_src/static/imgs/home2.png
+++ b/web_src/static/imgs/home2.png
--- a/web_src/static/imgs/home3.png
+++ b/web_src/static/imgs/home3.png
--- a/web_src/static/imgs/home4.png
+++ b/web_src/static/imgs/home4.png
--- a/web_src/static/imgs/home5.png
+++ b/web_src/static/imgs/home5.png
--- a/web_src/static/imgs/home6.png
+++ b/web_src/static/imgs/home6.png
--- a/web_src/static/imgs/home7.png
+++ b/web_src/static/imgs/home7.png
--- a/web_src/static/imgs/home8.png
+++ b/web_src/static/imgs/home8.png
--- a/web_src/static/imgs/home9.png
+++ b/web_src/static/imgs/home9.png
--- a/web_src/static/imgs/iOS.png
+++ b/web_src/static/imgs/iOS.png
--- a/web_src/static/imgs/regbg.jpg
+++ b/web_src/static/imgs/regbg.jpg
--- a/web_src/static/lang/en.js
+++ b/web_src/static/lang/en.js
@@ -7,25 +7,42 @@ exports.default = {
 
				   my_item: 'My items',
			
 
				   section_title1: 'ShowDoc',
			
 
				   section_description1: ' A tool greatly applicable for an IT team',
			
 
				+  section_description1_1: 'A tool greatly applicable',
			
 
				+  section_description1_2: 'for an IT team',
			
 
				   section_title2: 'API Document',
			
 
				-  section_description2:
			
 
				-    'ShowDoc can compile exquisite API documents <br>in a very fast and convenient way',
			
 
				+  section_description2_1:
			
 
				+    'ShowDoc can compile exquisite API documents',
			
 
				+  section_description2_2:
			
 
				+    'in a very fast and convenient way',
			
 
				   section_title3: 'Data Dictionary',
			
 
				-  section_description3:
			
 
				-    'A good Data Dictionary can easily exhibit database structure to other people<br>ShowDoc can compile exquisite Data Dictionary',
			
 
				+  section_description3_1:
			
 
				+    'A good Data Dictionary can easily exhibit database structure to other people',
			
 
				+  section_description3_2:
			
 
				+    'ShowDoc can compile exquisite Data Dictionary',
			
 
				   section_title4: 'Explanation Document',
			
 
				-  section_description4:
			
 
				+  section_description4_1:
			
 
				+    'You can absolutely use ShowDoc to compile the explanation documents for some tools',
			
 
				+  section_description4_2:
			
 
				     'You can absolutely use ShowDoc to compile the explanation documents for some tools',
			
 
				   section_title5: 'Team Work',
			
 
				   section_description5: 'Your team will work with ShowDoc together very well ',
			
 
				-  section_title6: 'Open Source',
			
 
				-  section_description6:
			
 
				-    'ShowDoc is a free, open source tool that <br>you can deploy it to your own server',
			
 
				-  section_title7: 'Hosted online',
			
 
				-  section_description7:
			
 
				-    'Www.showdoc.cc provide security and stability of the document hosting service',
			
 
				-  section_title8: 'Try it now',
			
 
				-  section_description8: 'Over 10000+ IT team is using ShowDoc',
			
 
				+  section_title6: 'Document Automation',
			
 
				+  section_description6_1:
			
 
				+    'Documents can be generated automatically from code comments',
			
 
				+  section_description6_2:
			
 
				+    'With the runapi client, you can debug the interface and automatically generate documents',
			
 
				+  section_title7: 'Open Source',
			
 
				+  section_description7_1:
			
 
				+    'ShowDoc is a free, open source tool',
			
 
				+  section_description7_2:
			
 
				+    'You can deploy it to your own server',
			
 
				+  section_title8: 'Hosted online',
			
 
				+  section_description8_1:
			
 
				+    'www.showdoc.com.cn provide security and stability of the document hosting service',
			
 
				+  section_description8_2:
			
 
				+    'You can safely choose to host your document data in the cloud',
			
 
				+  section_title9: 'Try it now',
			
 
				+  section_description9: 'Over 100000+ IT team is using ShowDoc',
			
 
				 
			
 
				   // user
			
 
				   login: 'Login',
			
--- a/web_src/static/lang/zh-CN.js
+++ b/web_src/static/lang/zh-CN.js
@@ -6,26 +6,42 @@ exports.default = {
 
				   index_login_or_register: '登录 / 注册',
			
 
				   my_item: '我的项目',
			
 
				   section_title1: 'ShowDoc',
			
 
				-  section_description1: '一个非常适合IT团队的在线API文档、技术文档工具',
			
 
				+  section_description1_1: '一个非常适合IT团队的',
			
 
				+  section_description1_2: '在线API文档、技术文档工具',
			
 
				   section_title2: 'API文档',
			
 
				-  section_description2:
			
 
				-    ' APP、web前端与服务器常用API来进行交互<br>用ShowDoc可以非常方便快速地编写出美观的API文档',
			
 
				+  section_description2_1:
			
 
				+    'APP、web前端与服务器常用API来进行交互',
			
 
				+  section_description2_2:
			
 
				+    'ShowDoc可以非常方便快速地编写出美观的API文档',
			
 
				   section_title3: '数据字典',
			
 
				-  section_description3:
			
 
				-    '好的数据字典可以很方便地向别人描述你的数据库结构<br>用ShowDoc可以编辑出美观的数据字典',
			
 
				+  section_description3_1:
			
 
				+    '好的数据字典可以方便地向别人描述你的数据库结构',
			
 
				+  section_description3_2:
			
 
				+    '用ShowDoc可以编辑出美观的数据字典',
			
 
				   section_title4: '说明文档',
			
 
				-  section_description4:
			
 
				-    '你完全可以使用 ShowDoc来编写一些工具的说明书<br>也可以编写一些技术规范说明文档以供团队查阅',
			
 
				+  section_description4_1:
			
 
				+    '你完全可以使用 ShowDoc来编写一些工具的说明书',
			
 
				+  section_description4_2:
			
 
				+    '也可以编写一些技术规范说明文档以供团队查阅',
			
 
				   section_title5: '团队协作',
			
 
				   section_description5: '团队权限管理机制让团队良好地协同编写文档',
			
 
				-  section_title6: '免费开源',
			
 
				-  section_description6:
			
 
				-    'ShowDoc提供免费开源的版本<br>你可以选择将ShowDoc部署到你的服务器',
			
 
				-  section_title7: '在线托管',
			
 
				-  section_description7:
			
 
				-    'www.showdoc.cc 提供安全稳定的在线文档托管服务<br>你可以放心地选择托管你的文档数据在云端',
			
 
				-  section_title8: '立即体验',
			
 
				-  section_description8: '超过10000+互联网团队正在使用ShowDoc',
			
 
				+  section_title6: '文档自动化',
			
 
				+  section_description6_1:
			
 
				+    '可从代码注释中自动生成文档',
			
 
				+  section_description6_2:
			
 
				+    '搭配的RunApi客户端，可调试接口和自动生成文档',
			
 
				+  section_title7: '免费开源',
			
 
				+  section_description7_1:
			
 
				+    'ShowDoc提供免费开源的版本',
			
 
				+  section_description7_2:
			
 
				+    '你可以选择将ShowDoc部署到你的服务器',
			
 
				+  section_title8: '在线托管',
			
 
				+  section_description8_1:
			
 
				+    'www.showdoc.com.cn 安全稳定的在线文档托管服务',
			
 
				+  section_description8_2:
			
 
				+    '你可以放心地选择托管你的文档数据在云端',
			
 
				+  section_title9: '立即体验',
			
 
				+  section_description9: '超过100000+互联网团队正在使用ShowDoc',
			
 
				 
			
 
				   // user
			
 
				   login: '登录',