From 4deda573bfc6663c1793b29f60a6e1035d891520 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 23 八月 2019 16:36:42 +0800
Subject: [PATCH] news
---
src/views/index/index.vue | 94 ++++++++++++++++++++++++++++-------------------
1 files changed, 56 insertions(+), 38 deletions(-)
diff --git a/src/views/index/index.vue b/src/views/index/index.vue
index 5b03629..a04fe45 100644
--- a/src/views/index/index.vue
+++ b/src/views/index/index.vue
@@ -81,33 +81,49 @@
<h4 class="content_subtitle"><span>涓轰紒涓氭惌寤轰緵搴旈摼淇℃伅鍖栧钩鍙�</span></h4>
<el-carousel :interval="5000" arrow="always" class="platform_ul-m">
<el-carousel-item>
- <h3><img src="../../img/yuan1.jpg" alt=""></h3>
- <h2 style="margin-top: 0.3rem;">鑷富鐨勫彲閰嶇疆骞冲彴</h2>
+ <div class="mob-c">
+ <img src="../../img/home_c1.jpg" alt="">
+ <h2>鑷富鐨勫彲閰嶇疆骞冲彴</h2>
+ </div>
<p>浼楁墍鍛ㄧ煡锛岄渶姹傚彉鏇存槸IT椤圭洰鎴愯触鐨勫叧閿紝MingKeOS鏄撳彉鏇淬�佸彲閰嶇疆鐨勭壒鎬у彲浠ヤ负浼佷笟淇℃伅鍖栧缓璁句繚椹炬姢鑸�</p>
</el-carousel-item>
<el-carousel-item>
- <h3><img src="../../img/100.jpg" alt=""></h3>
- <h2 style="margin-top: 0.3rem;">鎴愮啛鐨勮涓氭柟妗�</h2>
+ <div class="mob-c">
+ <img src="../../img/home_c2.jpg" alt="">
+ <h2>鎴愮啛鐨勮涓氭柟妗�</h2>
+ </div>
<p>鏄庣宸茬粡涓鸿秴杩�2000瀹朵紒涓氳繘琛屼緵搴旈摼椤圭洰瀹炴柦锛屽彲鎻愪緵浼楀鎴愮啛鐨勪紒涓氬簲鐢ㄤ緵鎮ㄩ�夋嫨锛屾偍鏃犻渶缁勭粐浜哄憳鑺辫垂澶ч噺鏃堕棿鍘昏璁″紑鍙戯紝骞跺彲渚濇嵁浼佷笟涓�у寲闇�姹傚畬鎴愭柊鍔熻兘鐨勯厤缃�</p>
</el-carousel-item>
<el-carousel-item>
- <h3><img src="../../img/yuan2.jpg" alt=""></h3>
- <h2 style="margin-top: 0.3rem;">鐙湁鐨勫紑鍙戠敓鎬佸湀</h2>
+ <div class="mob-c">
+ <img src="../../img/home_c3.jpg" alt="">
+ <h2>鐙湁鐨勫紑鍙戠敓鎬佸湀</h2>
+ </div>
<p>鏄庣鎷ユ湁浼楀鐨勫钩鍙板疄鏂藉悎浣滀紮浼达紝鎮ㄥ彲浠ラ�夋嫨浠讳綍涓�瀹朵负鎮ㄥ畬鎴愰」鐩疄鏂斤紝涔熷彲浠ュ煿鍏昏嚜宸辩殑IT鍥㈤槦杩涜绯荤粺杩愮淮</p>
</el-carousel-item>
</el-carousel>
<ul class="platform_ul">
- <router-link to="/caseDetail" tag="li" v-for="(item, index) in 3" :key="item.menu_id">
- <h3 v-if="index == 0"><img src="../../img/yuan1.jpg" alt=""></h3>
- <h3 v-if="index == 1"><img src="../../img/100.jpg" alt=""></h3>
- <h3 v-if="index == 2"><img src="../../img/yuan2.jpg" alt=""></h3>
- <h2 v-if="index == 0">鑷富鐨勫彲閰嶇疆骞冲彴</h2>
- <h2 v-if="index == 1">鎴愮啛鐨勮涓氭柟妗�</h2>
- <h2 v-if="index == 2">鐙湁鐨勫紑鍙戠敓鎬佸湀</h2>
- <p v-if="index == 0" style="line-height:25px;">浼楁墍鍛ㄧ煡锛岄渶姹傚彉鏇存槸IT椤圭洰鎴愯触鐨勫叧閿紝MingKeOS鏄撳彉鏇淬�佸彲閰嶇疆鐨勭壒鎬у彲浠ヤ负浼佷笟淇℃伅鍖栧缓璁句繚椹炬姢鑸�</p>
- <p v-if="index == 1" style="line-height:25px;">鏄庣宸茬粡涓鸿秴杩�2000瀹朵紒涓氳繘琛屼緵搴旈摼椤圭洰瀹炴柦锛屽彲鎻愪緵浼楀鎴愮啛鐨勪紒涓氬簲鐢ㄤ緵鎮ㄩ�夋嫨锛屾偍鏃犻渶缁勭粐浜哄憳鑺辫垂澶ч噺鏃堕棿鍘昏璁″紑鍙戯紝骞跺彲渚濇嵁浼佷笟涓�у寲闇�姹傚畬鎴愭柊鍔熻兘鐨勯厤缃�</p>
- <p v-if="index == 2" style="line-height:25px;">鏄庣鎷ユ湁浼楀鐨勫钩鍙板疄鏂藉悎浣滀紮浼达紝鎮ㄥ彲浠ラ�夋嫨浠讳綍涓�瀹朵负鎮ㄥ畬鎴愰」鐩疄鏂斤紝涔熷彲浠ュ煿鍏昏嚜宸辩殑IT鍥㈤槦杩涜绯荤粺杩愮淮</p>
- </router-link>
+ <li>
+ <div>
+ <img src="../../img/home_c1.jpg" alt="">
+ <h2>鑷富鐨勫彲閰嶇疆骞冲彴</h2>
+ </div>
+ <p style="line-height:25px;">浼楁墍鍛ㄧ煡锛岄渶姹傚彉鏇存槸IT椤圭洰鎴愯触鐨勫叧閿紝MingKeOS鏄撳彉鏇淬�佸彲閰嶇疆鐨勭壒鎬у彲浠ヤ负浼佷笟淇℃伅鍖栧缓璁句繚椹炬姢鑸�</p>
+ </li>
+ <li>
+ <div>
+ <img src="../../img/home_c2.jpg" alt="">
+ <h2>鎴愮啛鐨勮涓氭柟妗�</h2>
+ </div>
+ <p style="line-height:25px;">鏄庣宸茬粡涓鸿秴杩�2000瀹朵紒涓氳繘琛屼緵搴旈摼椤圭洰瀹炴柦锛屽彲鎻愪緵浼楀鎴愮啛鐨勪紒涓氬簲鐢ㄤ緵鎮ㄩ�夋嫨锛屾偍鏃犻渶缁勭粐浜哄憳鑺辫垂澶ч噺鏃堕棿鍘昏璁″紑鍙戯紝骞跺彲渚濇嵁浼佷笟涓�у寲闇�姹傚畬鎴愭柊鍔熻兘鐨勯厤缃�</p>
+ </li>
+ <li>
+ <div>
+ <img src="../../img/home_c3.jpg" alt="">
+ <h2>鐙湁鐨勫紑鍙戠敓鎬佸湀</h2>
+ </div>
+ <p style="line-height:25px;">鏄庣鎷ユ湁浼楀鐨勫钩鍙板疄鏂藉悎浣滀紮浼达紝鎮ㄥ彲浠ラ�夋嫨浠讳綍涓�瀹朵负鎮ㄥ畬鎴愰」鐩疄鏂斤紝涔熷彲浠ュ煿鍏昏嚜宸辩殑IT鍥㈤槦杩涜绯荤粺杩愮淮</p>
+ </li>
</ul>
</div>
@@ -405,6 +421,17 @@
}
@media (max-width: 750px) and (min-width: 0) {
+ .mob-c {
+ position: relative;
+
+ h2 {
+ position: absolute;
+ font-size: 0.34rem;
+ top: 0.65rem;
+ left: 0.4rem;
+ color: #ffffff;
+ }
+ }
#canvas {
display: none;
}
@@ -692,7 +719,6 @@
.el-carousel__item {
width: 100%;
background: #fff;
- padding: 0.6rem 0 0;
h3 {
width: 2rem;
@@ -763,10 +789,6 @@
padding-bottom: 0.1rem;
box-sizing: border-box;
position: relative;
- // -webkit-transition: transform 1s, opacity 1s;
- // -moz-transition: transform 1s, opacity 1s;
- // -o-transition: transform 1s, opacity 1s;
- // transition: transform 1s, opacity 1s;
transition: all 0.7s;
.pulse {
@@ -899,33 +921,29 @@
.platform_ul {
display: flex;
- padding: 0 .8rem;
margin-bottom: 1.2rem;
li {
flex: 1;
margin: 0 .3rem;
- padding: 0.37rem;
+ padding-bottom: 0.3rem;
text-align: center;
+ box-shadow: 0px 0px 8px 0px rgba(79, 78, 80, 0.05);
- h3 {
- width: 100%;
-
- img {
- width: .93rem;
- height: .93rem;
- margin: 0 auto;
+ div {
+ position: relative;
+
+ h2 {
+ position: absolute;
+ font-size: 0.16rem;
+ top: 0.35rem;
+ left: 0.2rem;
+ color: #ffffff;
}
}
-
- h2 {
- font-size: 0.14rem;
- color: #20242A;
- margin: 0.3rem 0 0.15rem;
- }
-
p {
font-size: 0.13rem;
+ padding: 0.15rem;
color: #838383;
}
}
--
Gitblit v1.8.0