فهرست منبع

完成关于我们页面

Nnuo 8 سال پیش
والد
کامیت
a6f4a44a0c
2فایلهای تغییر یافته به همراه187 افزوده شده و 99 حذف شده
  1. 114 70
      resources/app/index.html
  2. 73 29
      resources/app/public/css/browser.css

+ 114 - 70
resources/app/index.html

@@ -9,82 +9,126 @@
     <link rel="stylesheet" href="./public/css/browser.css">
 </head>
 <body>
-<div class="CampusInfoBanner">
-    <div class="CampusInfoContainer">
-        <a href="index.html">
-            <img src="./public/img/logo.png" alt="logo">
-            <span class="title">有思俱乐部</span>
-        </a>
-        <div class="CampusInfoBannerItem">
-            <h1>急速预览,安全稳定</h1>
-            <p>更小的内存以及更快的我相应速度</p>
-
+<section class="CampusInfo-AboutUs">
+    <div class="CampusInfoBanner">
+            <div class="CampusInfoContainer">
+                <a href="index.html">
+                    <img src="./public/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="./public/img/index/window.png" alt="">
+                            <span>Windows</span>
+                        </div>
+                        <button class="BtnDownload">
+                            <img src="./public/img/index/download.png" alt="">
+                            <span>立即下载</span>
+                        </button>
+                    </li>
+                    <li>
+                        <div class="CampusInfoDownloadItem">
+                            <img src="./public/img/index/apple.png" alt="">
+                            <span>Apple</span>
+                        </div>
+                        <button class="BtnDownload">
+                            <img src="./public/img/index/download.png" alt="">
+                            <span>立即下载</span>
+                        </button>
+                    </li>
+                    <li>
+                        <div class="CampusInfoDownloadItem">
+                            <img src="./public/img/index/linux.png" alt="">
+                            <span>Linux</span>
+                        </div>
+                        <button class="BtnDownload">
+                            <img src="./public/img/index/download.png" alt="">
+                            <span>立即下载</span>
+                        </button>
+                    </li>   
+                </ul>
+            </div>
+        </div>  
+        <div class="CampusInfoIntroduce clearfix">
+            <div class="CampusInfoContainer">
+                <img class="fl" src="./public/img/index/computer2.png" alt="">
+                <div class="CampusInfoTitle fr">
+                    <h3>去繁求简</h3>
+                    <p>一个简洁高效的游览器</p>
+                </div>
+            </div>
         </div>
-        <ul class="CampusInfoDownload">
-            <li>
-                <div class="CampusInfoDownloadItem">
-                    <img src="./public/img/index/window.png" alt="">
-                    <span>Windows</span>
+        <div class="CampusInfoKernel">
+            <div class="CampusInfoContainer">
+                <div class="CampusInfoTitle">
+                    <h3>内置webkit内核</h3>
+                    <p>急速浏览体验</p>
                 </div>
-                <button class="BtnDownload">
-                    <img src="./public/img/index/download.png" alt="">
-                    <span>立即下载</span>
-                </button>
-            </li>
-            <li>
-                <div class="CampusInfoDownloadItem">
-                    <img src="./public/img/index/apple.png" alt="">
-                    <span>Apple</span>
+                <ul>
+                    <li>
+                        <img src="./public/img/index/computer.png" alt="">
+                        <p>快速打开网页</p>
+                    </li>
+                    <li>
+                        <img src="./public/img/index/kernel.png" alt="">
+                        <p>快速打开网页</p>
+                    </li>
+                    <li>
+                        <img src="./public/img/index/quickStart.png" alt="">
+                        <p>快速打开网页</p>
+                    </li>
+                </ul>
+            </div>
+        </div>
+        <div class="CampusInfoTools">
+            <div class="CampusInfoContainer">
+                <img class="fl" src="./public/img/index/developmentTools.png" alt="">
+                <div class="CampusInfoTitle fr">
+                    <h3>简洁美观</h3>
+                    <p>一个简洁高效的游览器</p>
                 </div>
-                <button class="BtnDownload">
-                    <img src="./public/img/index/download.png" alt="">
-                    <span>立即下载</span>
-                </button>
-            </li>
-            <li>
-                <div class="CampusInfoDownloadItem">
-                    <img src="./public/img/index/linux.png" alt="">
-                    <span>Linux</span>
+            </div>
+        </div>
+        <div class="CampusInfoSafety">
+            <div class="CampusInfoContainer">
+                <div class="CampusInfoTitle fl">
+                    <h3>时刻保护上网安全</h3>
+                    <p>信息加密  ·  网站认证  ·  保证安全</p>
                 </div>
-                <button class="BtnDownload">
-                    <img src="./public/img/index/download.png" alt="">
-                    <span>立即下载</span>
-                </button>
-            </li>   
-        </ul>
-    </div>
-</div>  
-<div class="CampusInfoIntroduce clearfix">
-    <div class="CampusInfoContainer">
-        <img class="fl" src="./public/img/index/computer2.png" alt="">
-        <div class="CampusInfoTitle fr">
-            <h3>去繁求简</h3>
-            <p>一个简洁高效的游览器</p>
+                <img class="fr" src="./public/img/index/save.png" alt="">
+            </div>
         </div>
-    </div>
-</div>
-<div class="CampusInfoKernel">
-    <div class="CampusInfoContainer">
-        <div class="CampusInfoTitle">
-            <h3>内置webkit内核</h3>
-            <p>急速浏览体验</p>
+        <div class="CampusInfoFooter">
+            <div class="CampusInfoContainer">
+                <ul>
+                <li>
+                    <img src="./public/img/index/company.png" alt="">
+                    <span>深圳市易软智科技有限公司</span>
+                </li>
+                <li>
+                    <img src="./public/img/index/address.png" alt="">
+                    <span>深圳市龙岗区五联社区将军帽路1号</span>
+                </li>
+                <li>
+                    <img src="./public/img/index/email.png" alt="">
+                    <span>2553420729@qq.com</span>
+                </li>
+                <li>
+                    <img src="./public/img/index/phone.png" alt="">
+                    <span>15875580853</span>
+                </li>
+                <div class="line"></div>
+                </ul>
+                <p class="copyright">CopyRight  ©  www.1473.cn.All CopyRight Reserved  版权所有api.1473.cn。 粤ICP备12057053号</p>
+            </div>
         </div>
-        <ul>
-            <li>
-                <img src="./public/img/index/computer.png" alt="">
-                <p>快速打开网页</p>
-            </li>
-            <li>
-                <img src="./public/img/index/kernel.png" alt="">
-                <p>快速打开网页</p>
-            </li>
-            <li>
-                <img src="./public/img/index/quickStart.png" alt="">
-                <p>快速打开网页</p>
-            </li>
-        </ul>
-    </div>
-</div>
+</section>
 <script src="./public/js/uform.js"></script>
 <!-- <script src="./public/js/browser.js"></script> -->
 </body>

+ 73 - 29
resources/app/public/css/browser.css

@@ -291,8 +291,11 @@ button.BrowwerAdd {
     background: #e8e8e8;
     margin: 5px 0;
 }
-/* 首页 */
-.CampusInfoBanner{
+/* CampusInfo-AboutUs */
+.CampusInfo-AboutUs{
+    min-width: 1180px;
+}
+.CampusInfo-AboutUs .CampusInfoBanner{
     position: relative;
     height: 600px;
     background-image: url(../img/index/banner.png);
@@ -302,20 +305,22 @@ button.BrowwerAdd {
     background-size: cover;
     z-index: 200;
 }
-.CampusInfoContainer{
-    max-width: 1080px;
+.CampusInfo-AboutUs .CampusInfoContainer{
+    max-width: 1180px;
+    min-width: 1180px;
     height: inherit;
     margin: 0 auto;
     -webkit-font-smoothing: subpixel-antialiased;
     text-align: center;
 }
-.CampusInfoContainer .fl{
+.CampusInfo-AboutUs .CampusInfoContainer .fl{
     float: left;
 }
-.CampusInfoContainer .fr{
+.CampusInfo-AboutUs .CampusInfoContainer .fr {
     float: right;
+    padding: 0 80px;
 }
-.CampusInfoBanner a {
+.CampusInfo-AboutUs .CampusInfoBanner a {
     float: left;
     width: auto;
     padding: 20px 0;
@@ -323,47 +328,47 @@ button.BrowwerAdd {
     max-width: 200px;
     text-decoration: none;
 }
-.CampusInfoBanner img{
+.CampusInfo-AboutUs .CampusInfoBanner img{
     width: 25px;
 }
-.CampusInfoBanner span{
+.CampusInfo-AboutUs .CampusInfoBanner span{
     display: block;
     padding-left: 10px;
     line-height: 28px;
     font-size: 16px;
     color: #e0e0e0;
 }
-.CampusInfoBannerItem {
+.CampusInfo-AboutUs .CampusInfoBannerItem {
     width: 730px;
     padding-top: 160px;
     margin: auto;
 }
-.CampusInfoBannerItem h1{
+.CampusInfo-AboutUs .CampusInfoBannerItem h1{
     font-size: 64px;
     color: #fff;
 }
-.CampusInfoBannerItem p {
+.CampusInfo-AboutUs .CampusInfoBannerItem p {
     padding-top: 10px;
     font-size: 18px;
     color: #fff;
 }
-.CampusInfoDownloadItem {
+.CampusInfo-AboutUs .CampusInfoDownloadItem {
     display: flex;
     justify-content: center;
     align-items: center;
     padding: 10px 20px;
 }
-.CampusInfoDownload {
+.CampusInfo-AboutUs .CampusInfoDownload {
     width: 730px;
     margin: 45px auto 0;
 }
-.CampusInfoDownload li {
+.CampusInfo-AboutUs .CampusInfoDownload li {
     display: inline-block;
     padding: 0 15px;
     width: 150px;
     text-align: center;
 }
-.BtnDownload {
+.CampusInfo-AboutUs .BtnDownload {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -374,43 +379,82 @@ button.BrowwerAdd {
     border-radius: 5px;
     line-height: 12px;
 }
-.CampusInfoIntroduce {
+.CampusInfo-AboutUs .CampusInfoIntroduce {
     position: relative;
-    top: -80px;
+    top: -130px;
     z-index: 999;
 }
-.BtnDownload img{
+.CampusInfo-AboutUs .BtnDownload img{
     width: 18px;
 }
-.BtnDownload span{
+.CampusInfo-AboutUs .BtnDownload span{
     display:inline-block;
 }
-.CampusInfoIntroduce .CampusInfoTitle {
-    padding: 190px 0;
+.CampusInfo-AboutUs .CampusInfoIntroduce .CampusInfoTitle {
+    padding: 245px 0 0;
 }
-.CampusInfoTitle{
-    margin: 40px 0;
+.CampusInfo-AboutUs .CampusInfoTitle{
+    margin: 40px;
     line-height: 50px;
 }
-.CampusInfoTitle h3{
+.CampusInfo-AboutUs .CampusInfoTitle h3{
     font-size: 36px;
     color: #363636;
 }
-.CampusInfoTitle p{
+.CampusInfo-AboutUs .CampusInfoTitle p{
     font-size: 20px;
     color: #838383;
 }
-.CampusInfoKernel{
-    background: #ededed;
+.CampusInfo-AboutUs .CampusInfoKernel{
+    height: 410px;
     padding: 40px 0;
+    background: #ededed;
 }
-.CampusInfoKernel li {
+.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: 160px;
+}
+.CampusInfo-AboutUs .CampusInfoSafety {
+    height: 420px;
+    padding: 75px 0;
+    background: #ededed;
+}
+.CampusInfo-AboutUs .CampusInfoSafety .CampusInfoTitle{
+    padding-top: 120px;
+}
+.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 .CampusInfoFooter .copyright{
+    padding: 30px 0;
+    text-align: center;
+    font-size: 16px;
+    color: #ccc;
+}
 /* 首页end */
 @font-face {
     font-family: 'fontello';