Home Explore Help
Sign In
S.H.I.E.L.D.
/
Launcher
2
0
Fork 0
Files Pull Requests 0 Wiki
Browse Source

页面调整

outaozhen 7 years ago
parent
880205acd6
commit
a1c2875004
9 changed files with 121 additions and 64 deletions
Split View Show Diff Stats
  1. BIN
      css/bg1.jpg
  2. BIN
      css/bg2.jpg
  3. BIN
      css/favicon.ico
  4. 27 9
      css/global.css
  5. BIN
      css/gradient.jpg
  6. 3 2
      index.html
  7. 12 4
      software-details.html
  8. 16 1
      software-install.html
  9. 63 48
      software-list.html

BIN
css/bg1.jpg
View File


BIN
css/bg2.jpg
View File


BIN
css/favicon.ico
View File


+ 27 - 9
css/global.css
View File 

@@ -6,7 +6,16 @@
 
   height:564px;
 
   position:relative;
 
   overflow: hidden;
 
-  background:url(bg.jpg);
 
+  /*background:url(bg.jpg);*/
 
+}
 
+.bg{
 
+  position:absolute;
 
+  top:0;
 
+  left:0;
 
+  width:900px;
 
+  height:564px;
 
+  z-index: -2;
 
+  background:url(gradient.jpg);
 
 }
 
 ::-webkit-scrollbar-track
 
 {
 
@@ -63,8 +72,20 @@
 
 }
 
 .software-list{
 
   float:left;
 
-  width:380px;
 
-  margin: 0 30px 45px 25px;
 
+  width:390px;
 
+  background:#fefaf9;
 
+  border:1px solid #ddd;
 
+  border-radius: 7px;
 
+  padding:15px;
 
+  margin: 10px 25px 25px 30px;
 
+}
 
+.software-list:hover{
 
+  background:#fdf5f2;
 
+  border:1px solid #ff6501;
 
+}
 
+.software-list a{}
 
+.software-list a:hover{
 
+  text-decoration: none;
 
 }
 
 .detail-download{
 
   min-width:400px;
 
@@ -75,7 +96,6 @@
 
 .software-left{
 
   position: absolute;
 
   width:250px;
 
-  background:#fff;
 
   top:56px;
 
   bottom:0;
 
   left:0;
 
@@ -89,13 +109,13 @@
 
   overflow-y:auto;
 
 }
 
 .software:hover{
 
-  background:#FEFAF9;
 
+  background:#fefaf9;
 
 }
 
 .software a{
 
   text-decoration: none;
 
 }
 
 .software.active{
 
-  background:#FDF5F2;
 
+  background:#fdf5f2;
 
   border-left: 3px solid #ff6501;
 
 }
 
 .software.active a{
 
@@ -118,7 +138,6 @@
 
   overflow-y:auto;
 
 }
 
 .software-content{
 
-  background:#fff;
 
   height:371px;
 
   overflow-y:auto;
 
   padding-right: 15px;
 
@@ -132,7 +151,6 @@
 
 }
 
 .local-software-content{
 
   height:364px;
 
-  background:#fff;
 
   overflow-y:auto;
 
   padding-right: 15px;
 
 }
 
@@ -148,7 +166,7 @@
 
   height: 100px;
 
   position: absolute;
 
   width: 100%;
 
-  z-index:0;
 
+  z-index:-1;
 
 }
 
 #banner_bolang_bg_1{
 
   position: absolute;

BIN
css/gradient.jpg
View File


+ 3 - 2
index.html
View File 

@@ -45,11 +45,12 @@
 
           </ul>
 
         </div>
 
       </div>
 
-      <!-- <div class="bolangbanner">
 
+      <div class="bolangbanner">
 
         <div id="banner_bolang_bg_1" style="left: -434.722px;"></div>
 
         <div id="banner_bolang_bg_2" style="left: -336.283px;"></div>
 
-      </div> -->
 
+      </div>
 
       <!--[if lt IE 7]><style>.bolangbanner{display:none}</style><![endif]-->
 
+      <div class="bg"></div>
 
   	</div>

+ 12 - 4
software-details.html
View File 

@@ -10,7 +10,6 @@
 
     <title>启动器</title>
 
   </head>
 
   <body>
 
-    <!-- style="background: rgba(216,76,19,0.1);" -->
 
     <div class="container container-width border shadow-sm rounded mt-5 pl-0 pr-0">
 
       <div class="media p-3 pb-2 header border-bottom shadow-sm">
 
         <h5 class="mt-1 mr-2"><a href="index.html"><i class="fas fa-th-large"></i></a></h5>
 
@@ -133,16 +132,25 @@
 
                 </div>
 
               </div>
 
             </div>
 
-            <div class="tab-pane fade pt-3" id="details" role="tabpanel" aria-labelledby="profile-tab">
 
+            <div class="tab-pane fade pt-3 pl-3 pr-3" id="details" role="tabpanel" aria-labelledby="profile-tab">
 
+              <p><strong><span style="color:#e36c09">产品介绍：</span></strong></p>
 
+              <p>纵横公路造价软件2008年通过交通部测评，数据准确，品质保证。具有“模板克隆、定位查询、企业定额、清单调价、参数化设计、实时计算等功能。纵横公路软件以简洁的界面、个性化的资源、高效的算法和完善的管理让您的造价管理工作得心应手。</p>
 
+              <p><strong><span style="color:#e36c09">使用说明：</span></strong></p>
 
+              <p><a href="http://d2.smartcost.com.cn/doc/gongchengzaojiaguanlishouce.rar" target="blank">《纵横公路工程造价管理系统》简易操作手册</a></p><p><a href="http://d2.smartcost.com.cn/doc/zhaotoubiao.rar" target="blank">纵横公路造价软件招投标版功能演示</a></p>
 
+              <p><a href="http://d2.smartcost.com.cn/doc/gaiyusuan.rar" target="blank">纵横公路造价软件概预算版功能演示</a></p><p><a href="http://d2.smartcost.com.cn/doc/wangluoban.zip" target="blank">纵横工程造价软件免费网络版注册教程</a></p>
 
+              <p><a href="http://d2.smartcost.com.cn/doc/badianshiyonggongneng.zip" target="blank">纵横公路造价软件设计院客户8点实用功能</a></p>
 
+              <p><strong><span style="color:#e36c09">操作指引：</span></strong></p>
 
+              <p><img title="公路造价操作流程图.png" src="http://smartcost.com.cn/global/upload/img/20151028/14459972402207.png"></p>
 
             </div>
 
           </div>
 
         </div>
 
       </div>
 
-      <!-- <div class="bolangbanner">
 
+      <div class="bolangbanner">
 
         <div id="banner_bolang_bg_1" style="left: -434.722px;"></div>
 
         <div id="banner_bolang_bg_2" style="left: -336.283px;"></div>
 
-      </div> -->
 
+      </div>
 
       <!--[if lt IE 7]><style>.bolangbanner{display:none}</style><![endif]-->
 
+      <div class="bg"></div>
 
     </div>

+ 16 - 1
software-install.html
View File 

@@ -144,18 +144,33 @@
 
                   <div>D:\Program Files (x86)\纵横软件</div>
 
                 </div>
 
               </div>
 
-              <div class="tab-pane fade" id="details" role="tabpanel" aria-labelledby="profile-tab">
 
+              <div class="tab-pane fade pt-3 pl-3 pr-3" id="details" role="tabpanel" aria-labelledby="profile-tab">
 
+                <p><strong><span style="color:#e36c09">产品介绍：</span></strong></p>
 
+                <p>纵横公路造价软件2008年通过交通部测评，数据准确，品质保证。具有“模板克隆、定位查询、企业定额、清单调价、参数化设计、实时计算等功能。纵横公路软件以简洁的界面、个性化的资源、高效的算法和完善的管理让您的造价管理工作得心应手。</p>
 
+                <p><strong><span style="color:#e36c09">使用说明：</span></strong></p>
 
+                <p><a href="http://d2.smartcost.com.cn/doc/gongchengzaojiaguanlishouce.rar" target="blank">《纵横公路工程造价管理系统》简易操作手册</a></p><p><a href="http://d2.smartcost.com.cn/doc/zhaotoubiao.rar" target="blank">纵横公路造价软件招投标版功能演示</a></p>
 
+                <p><a href="http://d2.smartcost.com.cn/doc/gaiyusuan.rar" target="blank">纵横公路造价软件概预算版功能演示</a></p><p><a href="http://d2.smartcost.com.cn/doc/wangluoban.zip" target="blank">纵横工程造价软件免费网络版注册教程</a></p>
 
+                <p><a href="http://d2.smartcost.com.cn/doc/badianshiyonggongneng.zip" target="blank">纵横公路造价软件设计院客户8点实用功能</a></p>
 
+                <p><strong><span style="color:#e36c09">操作指引：</span></strong></p>
 
+                <p><img title="公路造价操作流程图.png" src="http://smartcost.com.cn/global/upload/img/20151028/14459972402207.png"></p>
 
               </div>
 
             </div>
 
           </div>
 
         </div>
 
       </div>
 
+      <div class="bolangbanner">
 
+        <div id="banner_bolang_bg_1" style="left: -434.722px;"></div>
 
+        <div id="banner_bolang_bg_2" style="left: -336.283px;"></div>
 
+      </div>
 
+      <!--[if lt IE 7]><style>.bolangbanner{display:none}</style><![endif]-->
 
+      <div class="bg"></div>
 
   	</div>
 
     
 
     <script src="js/jquery-3.3.1.slim.min.js"></script>
 
     <script src="js/popper.min.js"></script>
 
     <script src="js/bootstrap.min.js"></script>
 
+    <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/global.js"></script>
 
   </body>
 
 </html>

+ 63 - 48
software-list.html
View File 

@@ -19,84 +19,99 @@
 
       </div>
 
       <div class="software-wrap software-wrapscroll pt-4">
 
         <div class="software-list">
 
-          <div class="media">
 
-            <img class="mr-3" src="images/product01.png" width="40" height="40" alt="公路造价（增值税）">
 
-            <div class="media-body">
 
-              <h4 class="mt-1 mb-1"><a href="software-details.html">公路造价（增值税）</a></h4>
 
-              <!-- 颜色：style="background-color: rgba(216,76,19,0.1);" -->
 
+          <a href="software-details.html">
 
+            <div class="media">
 
+              <img class="mr-3" src="images/product01.png" width="40" height="40" alt="公路造价（增值税）">
 
+              <div class="media-body">
 
+                <h5 class="mt-2 mb-1">公路造价（增值税）</h5>
 
+              </div>
 
             </div>
 
-          </div>
 
+          </a>
 
         </div>
 
         <div class="software-list">
 
-          <div class="media">
 
-            <img class="mr-3" src="images/product02.png" width="40" height="40" alt="广东公路造价">
 
-            <div class="media-body">
 
-              <h4 class="mt-1 mb-1"><a href="software-details.html">广东公路造价</a></h4>
 
-              <!-- 颜色：style="background-color: rgba(240,174,29,0.1);" -->
 
+          <a href="software-details.html">
 
+            <div class="media">
 
+              <img class="mr-3" src="images/product02.png" width="40" height="40" alt="广东公路造价">
 
+              <div class="media-body">
 
+                <h5 class="mt-2 mb-1">广东公路造价</h5>
 
+              </div>
 
             </div>
 
-          </div>
 
+          </a>
 
         </div>
 
         <div class="software-list">
 
-          <div class="media">
 
-            <img class="mr-3" src="images/product03.png" width="40" height="40" alt="计量支付结算决算">
 
-            <div class="media-body">
 
-              <h4 class="mt-1 mb-1"><a href="software-details.html">计量支付结算决算</a></h4>
 
-              <!-- 颜色：style="background-color: rgba(173,178,91,0.1);" -->
 
+          <a href="software-details.html">
 
+            <div class="media">
 
+              <img class="mr-3" src="images/product03.png" width="40" height="40" alt="计量支付结算决算">
 
+              <div class="media-body">
 
+                <h5 class="mt-2 mb-1">计量支付结算决算</h5>
 
+              </div>
 
             </div>
 
-          </div>
 
+          </a>
 
         </div>
 
         <div class="software-list">
 
-          <div class="media">
 
-            <img class="mr-3" src="images/product03.png" width="40" height="40" alt="验工计价成本分析">
 
-            <div class="media-body">
 
-              <h4 class="mt-1 mb-1"><a href="software-details.html">验工计价成本分析</a></h4>
 
-              <!-- 颜色：style="background-color: rgba(173,178,91,0.1);" -->
 
+          <a href="software-details.html">
 
+            <div class="media">
 
+              <img class="mr-3" src="images/product03.png" width="40" height="40" alt="验工计价成本分析">
 
+              <div class="media-body">
 
+                <h5 class="mt-2 mb-1">验工计价成本分析</h5>
 
+              </div>
 
             </div>
 
-          </div>
 
+          </a>
 
         </div>
 
         <div class="software-list">
 
-          <div class="media">
 
-            <img class="mr-3" src="images/product04.png" width="40" height="40" alt="材料调差（增值税）">
 
-            <div class="media-body">
 
-              <h4 class="mt-1 mb-1"><a href="software-details.html">材料调差（增值税）</a></h4>
 
-              <!-- 颜色：style="background-color: rgba(161,41,33,0.1);" -->
 
+          <a href="software-details.html">
 
+            <div class="media">
 
+              <img class="mr-3" src="images/product04.png" width="40" height="40" alt="材料调差（增值税）">
 
+              <div class="media-body">
 
+                <h5 class="mt-2 mb-1">材料调差（增值税）</h5>
 
+              </div>
 
             </div>
 
-          </div>
 
+          </a>
 
         </div>
 
         <div class="software-list">
 
-          <div class="media">
 
-            <img class="mr-3" src="images/product05.png" width="40" height="40" alt="养护造价（增值税）">
 
-            <div class="media-body">
 
-              <h4 class="mt-1 mb-1"><a href="software-details.html">养护造价（增值税）</a></h4>
 
-              <!-- 颜色：style="background-color: rgba(48,106,184,0.1);" -->
 
+          <a href="software-details.html">
 
+            <div class="media">
 
+              <img class="mr-3" src="images/product05.png" width="40" height="40" alt="养护造价（增值税）">
 
+              <div class="media-body">
 
+                <h5 class="mt-2 mb-1">养护造价（增值税）</h5>
 
+              </div>
 
             </div>
 
-          </div>
 
+          </a>
 
         </div>
 
         <div class="software-list">
 
-          <div class="media">
 
-            <img class="mr-3" src="images/product01.png" width="40" height="40" alt="固化清单">
 
-            <div class="media-body">
 
-              <h4 class="mt-1 mb-1"><a href="software-details.html">固化清单</a></h4>
 
-              <!-- 颜色：style="background-color: rgba(216,76,19,0.1);" -->
 
+          <a href="software-details.html">
 
+            <div class="media">
 
+              <img class="mr-3" src="images/product01.png" width="40" height="40" alt="固化清单">
 
+              <div class="media-body">
 
+                <h5 class="mt-2 mb-1">固化清单</h5>
 
+              </div>
 
             </div>
 
-          </div>
 
+          </a>
 
         </div>
 
         <div class="software-list">
 
-          <div class="media">
 
-            <img class="mr-3" src="images/product06.png" width="40" height="40" alt="公路算量">
 
-            <div class="media-body">
 
-              <h4 class="mt-1 mb-1"><a href="software-details.html">公路算量</a></h4>
 
-              <!-- 颜色：style="background-color: rgba(106,0,149,0.1);" -->
 
+          <a href="software-details.html">
 
+            <div class="media">
 
+              <img class="mr-3" src="images/product06.png" width="40" height="40" alt="公路算量">
 
+              <div class="media-body">
 
+                <h5 class="mt-2 mb-1">公路算量</h5>
 
+              </div>
 
             </div>
 
-          </div>
 
+          </a>
 
         </div>
 
       </div>
 
+      <div class="bolangbanner">
 
+        <div id="banner_bolang_bg_1" style="left: -434.722px;"></div>
 
+        <div id="banner_bolang_bg_2" style="left: -336.283px;"></div>
 
+      </div>
 
+      <!--[if lt IE 7]><style>.bolangbanner{display:none}</style><![endif]-->
 
+      <div class="bg"></div>
 
   	</div>
 
     
 
     <script src="js/jquery-3.3.1.slim.min.js"></script>
 
     <script src="js/popper.min.js"></script>
 
     <script src="js/bootstrap.min.js"></script>
 
+    <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/global.js"></script>
 
   </body>
 
 </html>