ソースを参照

调整tab结构和自适应的高度问题

outaozhen 6 年 前
コミット
1e6734509f
5 ファイル変更28 行追加12 行削除
  1. 1 5
      css/global.css
  2. 1 1
      js/global.js
  3. 20 0
      software-buliding.html
  4. 3 3
      software-details.html
  5. 3 3
      software-index.html

+ 1 - 5
css/global.css

@@ -330,7 +330,6 @@ body{
 }
 .software-tab-pane{
   background:#fff;
-  padding:15px;
   overflow-y:auto;
 }
 .software-content .tab-pane{
@@ -376,13 +375,10 @@ body{
   padding:15px;
   border: 2px solid #fff;
   border-radius: 3px;
-  margin:0 0 15px;
+  margin:15px;
   color:#888;
   font-size: 14px;
 }
-.software-tab-pane .details:last-child{
-  margin-bottom: 0;
-}
 .details-title{
   width:85%;
   font-size: 16px;

+ 1 - 1
js/global.js

@@ -15,7 +15,7 @@ function autoFlashHeight(){
 	var softwareDetailTop = $(".software-detail-top").height();
 	$(".autoHeightL1").height($(window).height()-80);
 	$(".autoHeightL2").height($(window).height()-80-198);
-	$(".autoHeightL3").height($(window).height()-80-softwareDetailTop-46);
+	$(".autoHeightL3").height($(window).height()-80-softwareDetailTop);
 	$(".autoHeightL4").height($(window).height()-80-119);
 	// console.log($(window).height());
 	console.log($(document).height());

+ 20 - 0
software-buliding.html

@@ -184,6 +184,26 @@
                       <div class="card-body"><h3 class="card-title">江西定额(2017)</h3><p class="card-text">符合赣建价[2017]7号文</p></div>
                     </div>
                   </div>
+                  <div class="col-sm-6">
+                    <div class="card card-block">
+                      <div class="card-body"><h3 class="card-title">重庆定额(2018)</h3><p class="card-text">符合渝建[2018]200号文</p></div>
+                    </div>
+                  </div>
+                  <div class="col-sm-6">
+                    <div class="card card-block">
+                      <div class="card-body"><h3 class="card-title">江西定额(2017)</h3><p class="card-text">符合赣建价[2017]7号文</p></div>
+                    </div>
+                  </div>
+                  <div class="col-sm-6">
+                    <div class="card card-block">
+                      <div class="card-body"><h3 class="card-title">重庆定额(2018)</h3><p class="card-text">符合渝建[2018]200号文</p></div>
+                    </div>
+                  </div>
+                  <div class="col-sm-6">
+                    <div class="card card-block">
+                      <div class="card-body"><h3 class="card-title">江西定额(2017)</h3><p class="card-text">符合赣建价[2017]7号文</p></div>
+                    </div>
+                  </div>
                 </div>
               </div>
             </div>

+ 3 - 3
software-details.html

@@ -154,15 +154,13 @@
       </div>
       <div class="software-wrap">
         <div class="software-detail-top pl-3">
-          <div class="media pt-3">
+          <div class="media pt-3 pb-3">
             <img class="mr-3" src="images/product01.png" width="50" height="50" alt="广东公路造价">
             <div class="media-body">
               <h5 class="mt-0 mb-1">公路造价(增值税)</h5>
               纵横公路工程造价管理系统
             </div>
           </div>
-        </div>
-        <div class="software-detail pt-3">
           <ul class="software-nav nav nav-tabs pl-3" id="myTab" role="tablist">
             <li class="nav-item">
               <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true"><span class="iconbg iconbg-purple rounded"><i class="fas fa-download"></i></span>下载软件</a>
@@ -171,6 +169,8 @@
               <a class="nav-link" id="profile-tab" data-toggle="tab" href="#details" role="tab" aria-controls="profile" aria-selected="false"><span class="iconbg iconbg-green rounded"><i class="fas fa-info"></i></span>软件详情</a>
             </li>
           </ul>
+        </div>
+        <div class="software-detail">
           <div class="tab-content software-content" id="myTabContent">
             <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
               <div class="software-tab-pane autoHeightL3">

+ 3 - 3
software-index.html

@@ -213,15 +213,13 @@
           </div>
           <div class="local-install">
             <div class="software-detail-top pl-3">
-              <div class="media pt-3">
+              <div class="media pt-3 pb-3">
                 <img class="mr-3" src="images/product01.png" width="50" height="50" alt="广东公路造价">
                 <div class="media-body">
                   <h5 class="mt-0 mb-1">公路造价(增值税)</h5>
                   纵横公路工程造价管理系统
                 </div>
               </div>
-            </div>
-            <div class="software-detail pt-3">
               <ul class="software-nav nav nav-tabs pl-3" id="myTab" role="tablist">
                 <li class="nav-item">
                   <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true"><span class="iconbg iconbg-purple rounded"><i class="fas fa-download"></i></span>下载软件</a>
@@ -233,6 +231,8 @@
                   <a class="nav-link" id="profile-tab" data-toggle="tab" href="#videos" role="tab" aria-controls="profile" aria-selected="false"><span class="iconbg iconbg-yellow rounded"><i class="fas fa-video"></i></span>动画教程</a>
                 </li>
               </ul>
+            </div>
+            <div class="software-detail">
               <div class="tab-content software-content" id="myTabContent">
                 <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
                   <div class="software-tab-pane autoHeightL3">