有思俱乐部游览器宣传页

css/index.css

@@ -0,0 +1,217 @@
+*{
+    margin: 0;
+    padding: 0;
+    font-family:Microsoft YaHei,fontello;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    list-style: none;
+}
+body{
+    margin: 0;
+    padding: 0;
+}
+ul,li{
+    margin: 0;
+    padding: 0;
+    list-style: none;
+}
+button:focus,button{    
+    outline: none;
+    cursor: pointer;
+}
+a,a:hover,a:link,a:visited,button,button:focus,button:hover,i,i:hover,img,img:hover,input,input:focus,input:hover,select:focus,span,span:hover,textarea:focus {
+    -webkit-transition:all .35s;
+    -moz-transition:all .35s;
+    -o-transition:all .35s;
+}
+a:hover,a:link,a:visited {
+    text-decoration:none;
+}
+button:hover {
+    opacity: .8;
+    cursor:pointer;
+}
+.clearfix{
+    zoom:1;
+}
+a{
+	color:#fff
+}
+/* CampusInfo-AboutUs */
+.CampusInfo-AboutUs{
+    min-width: 1180px;
+}
+.CampusInfo-AboutUs .CampusInfoBanner{
+    position: relative;
+    height: 600px;
+    background-image: url(../img/index/banner.png);
+    background-size: contain;
+    background-position: 50% 50%;
+    background-repeat: no-repeat;
+    background-size: cover;
+    z-index: 200;
+}
+.CampusInfo-AboutUs .CampusInfoContainer{
+    max-width: 1180px;
+    min-width: 1180px;
+    height: inherit;
+    margin: 0 auto;
+    -webkit-font-smoothing: subpixel-antialiased;
+    text-align: center;
+}
+.CampusInfo-AboutUs .CampusInfoContainer .fl{
+    float: left;
+}
+.CampusInfo-AboutUs .CampusInfoContainer .fr {
+    float: right;
+    text-align: left;
+}
+.CampusInfo-AboutUs .CampusInfoBanner a {
+    float: left;
+    width: auto;
+    padding: 20px 0;
+    display: -webkit-inline-box;
+    max-width: 200px;
+    text-decoration: none;
+}
+.CampusInfo-AboutUs .CampusInfoBanner img{
+    width: 25px;
+}
+.CampusInfo-AboutUs .CampusInfoBanner span{
+    display: block;
+    padding-left: 10px;
+    line-height: 28px;
+    font-size: 16px;
+    color: #e0e0e0;
+}
+.CampusInfo-AboutUs .CampusInfoBannerItem {
+    width: 730px;
+    padding-top: 160px;
+    margin: auto;
+}
+.CampusInfo-AboutUs .CampusInfoBannerItem h1{
+    font-size: 64px;
+    color: #fff;
+}
+.CampusInfo-AboutUs .CampusInfoBannerItem p {
+    padding-top: 10px;
+    font-size: 18px;
+    color: #fff;
+}
+.CampusInfo-AboutUs .CampusInfoDownloadItem {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 10px 20px;
+}
+.CampusInfo-AboutUs .CampusInfoDownload {
+    width: 730px;
+    margin: 45px auto 0;
+}
+.CampusInfo-AboutUs .CampusInfoDownload li {
+    display: inline-block;
+    padding: 0 15px;
+    width: 150px;
+    text-align: center;
+}
+.CampusInfo-AboutUs .BtnDownload {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 150px;
+    height: 40px;
+    background: #0077e6;
+    border: transparent;
+    border-radius: 5px;
+    line-height: 12px;
+}
+.CampusInfo-AboutUs .CampusInfoIntroduce {
+    position: relative;
+    top: -130px;
+    height: 520px;
+    z-index: 999;
+}
+.CampusInfo-AboutUs .CampusInfoIntroduce img{
+  text-align: left;
+}
+.CampusInfo-AboutUs .BtnDownload img{
+    width: 18px;
+}
+.CampusInfo-AboutUs .BtnDownload span{
+    display:inline-block;
+}
+.CampusInfo-AboutUs .CampusInfoIntroduce .CampusInfoTitle {
+    padding: 235px 0 0;
+    line-height: 3;
+}
+.CampusInfo-AboutUs .CampusInfoTitle {
+    margin: 40px;
+    line-height: 50px;
+    line-height: 3;
+}
+.CampusInfo-AboutUs .CampusInfoTitle h3 {
+    font-size: 36px;
+    color: #333;
+}
+.CampusInfo-AboutUs .CampusInfoTitle p {
+    width: 300px;
+    margin: auto;
+    font-size: 16px;
+    color: rgb(105, 105, 105);
+    line-height: 2;
+}
+.CampusInfo-AboutUs .CampusInfoKernel {
+    height: 460px;
+    padding: 20px 0;
+    background: #f5f5f5;
+}
+.CampusInfo-AboutUs .CampusInfoKernel li {
+    display: inline-block;
+    padding: 0 60px;
+    line-height: 30px;
+    font-size: 16px;
+    color: #979696;
+}
+.CampusInfo-AboutUs .CampusInfoTools {
+    height: 500px;
+    padding: 80px 0;
+}
+.CampusInfo-AboutUs .CampusInfoTools .CampusInfoTitle {
+    padding-top: 100px;
+}
+.CampusInfo-AboutUs .CampusInfoSafety {
+    height: 420px;
+    padding: 75px 0;
+    background: #f5f5f5;
+}
+.CampusInfo-AboutUs .CampusInfoSafety .CampusInfoTitle {
+    padding-top: 60px;
+}
+.CampusInfo-AboutUs .CampusInfoFooter {
+    height: 200px;
+    background: #494949;
+}
+.CampusInfo-AboutUs .CampusInfoFooter li {
+    display: inline-block;
+    padding: 45px 15px;
+}
+.CampusInfo-AboutUs .CampusInfoContainer li span{
+    color: #ccc;
+    font-size: 14px;
+}
+.CampusInfo-AboutUs .CampusInfoFooter .line{
+    width: 100%;
+    height: 2px;
+    background: rgba(255, 255, 255, 0.23);
+}
+.CampusInfo-AboutUs .author{
+    padding-bottom: 30px;
+    font-size: 14px;
+    color: #ccc;
+}
+.CampusInfo-AboutUs .CampusInfoFooter .copyright{
+    padding: 30px 0;
+    text-align: center;
+    font-size: 16px;
+    color: #ccc;
+}

index.html

@@ -0,0 +1,135 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>有思俱乐部</title>
+    <link rel="stylesheet" href="./css/uform.css">
+    <link rel="stylesheet" href="./css/index.css">
+	<link href="./img/logo.png" rel="shortcut icon">
+</head>
+<body>
+<section class="CampusInfo-AboutUs">
+    <div class="CampusInfoBanner">
+            <div class="CampusInfoContainer">
+                <a href="index.html">
+                    <img src="./img/logo.png" alt="logo">
+                    <span class="title">有思俱乐部</span>
+                </a>
+                <div class="CampusInfoBannerItem">
+                    <h1>急速预览，安全稳定</h1>
+                    <p>更小的内存以及更快的我相应速度</p>
+        
+                </div>
+                <ul class="CampusInfoDownload">
+                    <li>
+                        <div class="CampusInfoDownloadItem">
+                            <img src="./img/index/window.png" alt="">
+                            <span>Windows</span>
+                        </div>
+                        <button class="BtnDownload">
+                            <img src="./img/index/download.png" alt="">
+                            <span><a style='padding:0' href='setup/Usestudio-Browers_setup_1.0.0.exe' target='_blank'>立即下载</a></span>
+                        </button>
+                    </li>
+                    <li>
+                        <div class="CampusInfoDownloadItem">
+                            <img src="./img/index/apple.png" alt="">
+                            <span>Apple</span>
+                        </div>
+                        <button class="BtnDownload">
+                            <img src="./img/index/download.png" alt="">
+                            <span><a style='padding:0' href='setup/us_browers.exe' target='_blank'>立即下载</a></span>
+                        </button>
+                    </li>
+                    <li>
+                        <div class="CampusInfoDownloadItem">
+                            <img src="./img/index/linux.png" alt="">
+                            <span>Linux</span>
+                        </div>
+                        <button class="BtnDownload">
+                            <img src="./img/index/download.png" alt="">
+                            <span><a style='padding:0' href='setup/us_browers.exe' target='_blank'>立即下载</a></span>
+                        </button>
+                    </li>   
+                </ul>
+            </div>
+        </div>  
+        <div class="CampusInfoIntroduce clearfix">
+            <div class="CampusInfoContainer">
+                <img src="./img/index/computer2.png" alt="">
+                <div class="CampusInfoTitle fr">
+                    <h3>去繁求简</h3>
+                    <p>一个简洁高效的浏览器,页面载入更好、更快,占用内存更少</p>
+                </div>
+            </div>
+        </div>
+        <div class="CampusInfoKernel">
+            <div class="CampusInfoContainer">
+                <div class="CampusInfoTitle">
+                    <h3>内置webkit内核</h3>
+                    <p>急速浏览体验</p>
+                </div>
+                <ul>
+                    <li>
+                        <img src="./img/index/computer.png" alt="">
+                        <p>快速打开网页</p>
+                    </li>
+                    <li>
+                        <img src="./img/index/kernel.png" alt="">
+                        <p>内核性能强</p>
+                    </li>
+                    <li>
+                        <img src="./img/index/quickStart.png" alt="">
+                        <p>快速启动</p>
+                    </li>
+                </ul>
+            </div>
+        </div>
+        <div class="CampusInfoTools clearfix">
+            <div class="CampusInfoContainer">
+                <img class="fl" src="./img/index/developmentTools.png" alt="">
+                <div class="CampusInfoTitle fr">
+                    <h3>简约美观</h3>
+                    <p>界面采用简约美观的设计,让用户使用轻松，提高用户体验</p>
+                </div>
+            </div>
+        </div>
+        <div class="CampusInfoSafety clearfix">
+            <div class="CampusInfoContainer">
+                <div class="CampusInfoTitle fl">
+                    <h3>时刻保护上网安全</h3>
+                    <p>信息加密  ·  网站认证  ·  保证安全  信息加密  ·  网站认证  ·  保证安全.强力拦截网页弹窗、广告,密码安全保存、智能填写</p>
+                </div>
+                <img class="fr" src="./img/index/save.png" alt="">
+            </div>
+        </div>
+        <div class="CampusInfoFooter">
+            <div class="CampusInfoContainer">
+                <ul>
+                <li>
+                    <img src="./img/index/company.png" alt="">
+                    <span>深圳市易软智科技有限公司</span>
+                </li>
+                <li>
+                    <img src="./img/index/address.png" alt="">
+                    <span>深圳市龙岗区五联社区将军帽路1号</span>
+                </li>
+                <li>
+                    <img src="./img/index/email.png" alt="">
+                    <span>2553420729@qq.com</span>
+                </li>
+                <li>
+                    <img src="./img/index/phone.png" alt="">
+                    <span>15875580853</span>
+                </li>
+                <!-- <div class="author">作者:郑锦宏、蔡文东</div> -->
+                <div class="line"></div>
+                </ul>
+                <p class="copyright">CopyRight  ©  www.1473.cn.All CopyRight Reserved  版权所有api.1473.cn。 粤ICP备12057053号</p>
+            </div>
+        </div>
+</section>
+</body>
+</html>