@@ -36,7 +36,7 @@ export default { | |||
background: none !important; | |||
border-bottom: none !important; | |||
width: 50%; | |||
min-width: 900px; | |||
min-width: 800px; | |||
} | |||
.el-menu-item { | |||
margin-right: 3%; | |||
@@ -1,9 +1,9 @@ | |||
<template> | |||
<el-container> | |||
<el-header> | |||
<img src="@/assets/logo.png" id="logo" /> | |||
<yqheaders/> | |||
<el-button plain class="login" size="small">注册 / 登陆</el-button> | |||
<img src="@/assets/logo.png" id="logo" /> | |||
<yqheaders/> | |||
<el-button plain class="login" size="small">注册 / 登陆</el-button> | |||
</el-header> | |||
<el-main> | |||
<router-view /> | |||
@@ -31,8 +31,8 @@ | |||
<div class="bottom"/> | |||
</div> | |||
</div> | |||
<div id="wk"> | |||
<div class="content"> | |||
<div class="swhz"> | |||
<div class="content"> | |||
<div class="callme"> | |||
<a class="title">商务合作</a> | |||
<div> | |||
@@ -43,6 +43,18 @@ | |||
<img src="../../assets/aboutbottom.png"> | |||
</div> | |||
</div> | |||
<!-- <div id="wk"> | |||
<div class="content"> | |||
<div class="callme"> | |||
<a class="title">商务合作</a> | |||
<div> | |||
<a>联系方式: 458233656411</a> | |||
<a>联系邮箱: 458233656411@Gmail.com</a> | |||
</div> | |||
</div> | |||
<img src="../../assets/aboutbottom.png"> | |||
</div> | |||
</div> --> | |||
</div> | |||
</template> | |||
<script> | |||
@@ -120,25 +132,23 @@ export default { | |||
#hot, #daliay, #wk { | |||
width: 100%; | |||
height: 700px; | |||
display: flex; | |||
align-items: center; | |||
flex-direction: column; | |||
justify-content: center; | |||
background: #E3E5EA; | |||
.content { | |||
min-width: 1100px; | |||
width: 60%; | |||
width: 1200px; | |||
height: 90%; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: space-between; | |||
padding-top: 30px; | |||
.top, .bottom { | |||
width: 100%; | |||
} | |||
.top { | |||
min-height: 470px; | |||
margin-bottom: 40px; | |||
margin-bottom: 30px; | |||
display: flex; | |||
align-items: center; | |||
justify-content: space-around; | |||
@@ -211,6 +221,7 @@ export default { | |||
min-height: 120px; | |||
background-image: url('../../assets/bottom.png'); | |||
background-size: 100% 100%; | |||
margin-bottom: 30px; | |||
} | |||
} | |||
} | |||
@@ -234,6 +245,47 @@ export default { | |||
} | |||
} | |||
} | |||
.swhz { | |||
background: #E3E5EA; | |||
.content { | |||
display: flex; | |||
flex-direction: row; | |||
align-items: center; | |||
margin: 0 auto; | |||
width: 1200px; | |||
padding: 96px 0; | |||
.callme { | |||
display: flex; | |||
flex-direction: column; | |||
.title { | |||
font-size: 36px; | |||
border-left: 7px solid #07CAAF; | |||
padding-left: 30px; | |||
text-align: left; | |||
font-weight: bold; | |||
color: #0D1114; | |||
} | |||
div { | |||
margin-top: 50px; | |||
a { | |||
text-align: left; | |||
display: block; | |||
padding-left: 35px; | |||
font-size: 18px; | |||
font-weight: 400; | |||
color: #0D1114; | |||
line-height: 30px; | |||
} | |||
} | |||
} | |||
img { | |||
width: 390px; | |||
height: 240px; | |||
margin-left: 300px; | |||
} | |||
} | |||
} | |||
#wk { | |||
height: 400px; | |||
background: #E3E5EA; | |||
@@ -242,7 +294,7 @@ export default { | |||
flex-direction: row; | |||
align-items: center; | |||
.callme { | |||
height: 60%; | |||
height: 1200px; | |||
display: flex; | |||
flex-direction: column; | |||
.title { | |||
@@ -142,12 +142,6 @@ export default { | |||
name: '丰田锋兰达值得买吗?', | |||
content: '年底购车多少钱能落地价?', | |||
flag: 'video' | |||
}, | |||
{ | |||
img: '/aigc_img4.png', | |||
name: '丰田锋兰达值得买吗?', | |||
content: '年底购车多少钱能落地价?', | |||
flag: 'video' | |||
} | |||
], | |||
gg1: '', | |||
@@ -284,15 +278,14 @@ export default { | |||
#hot, #daliay { | |||
width: 100%; | |||
height: 700px; | |||
background: #E3E5EA; | |||
display: flex; | |||
align-items: center; | |||
flex-direction: column; | |||
justify-content: center; | |||
padding-top: 30px; | |||
.content { | |||
min-width: 1100px; | |||
width: 60%; | |||
width: 1200px; | |||
height: 90%; | |||
display: flex; | |||
flex-direction: column; | |||
@@ -301,12 +294,12 @@ export default { | |||
width: 100%; | |||
} | |||
.top { | |||
min-height: 470px; | |||
margin-bottom: 40px; | |||
margin-bottom: 30px; | |||
background-color: #FFFFFF; | |||
display: flex; | |||
align-items: center; | |||
justify-content: space-around; | |||
padding: 20px 0; | |||
.ai { | |||
position: relative; | |||
a { | |||
@@ -356,10 +349,12 @@ export default { | |||
min-height: 120px; | |||
background-image: url('../../assets/bottom.png'); | |||
background-size: 100% 100%; | |||
margin-bottom: 30px; | |||
} | |||
} | |||
} | |||
#daliay { | |||
padding-top: 0; | |||
.content { | |||
.top { | |||
background-color: #ffffff00; | |||
@@ -389,13 +384,13 @@ export default { | |||
} | |||
#zb { | |||
.imagezb { | |||
width: 240px; | |||
width: 220px; | |||
height: 400px; | |||
float: left; | |||
margin-right: 60px; | |||
margin-right: 20px; | |||
position: relative; | |||
img { | |||
width: 240px; | |||
width: 220px; | |||
height: 370px; | |||
} | |||
.el-button { | |||
@@ -1,6 +1,6 @@ | |||
<template> | |||
<div> | |||
<el-carousel height="590px"> | |||
<el-carousel > | |||
<el-carousel-item v-for="(item, index) in carouselList" :key="index" :style="{ backgroundImage: `url(${item.src})` }"> | |||
<div id="txt"> | |||
<a class="title">{{ item.title }}</a> | |||
@@ -1,6 +1,6 @@ | |||
<template> | |||
<div> | |||
<el-carousel height="590px"> | |||
<el-carousel > | |||
<el-carousel-item v-for="(item, index) in carouselList" :key="index" :style="{ backgroundImage: `url(${item.src})` }"> | |||
<div id="txt"> | |||
<a class="title">{{ item.title }}</a> | |||
@@ -1,6 +1,6 @@ | |||
<template> | |||
<div> | |||
<el-carousel height="590px"> | |||
<el-carousel > | |||
<el-carousel-item class="lunbo" v-for="(item, index) in carouselList" :key="index" :style="{ backgroundImage: `url(${item.src})` }"> | |||
<div id="txt"> | |||
<a class="title">{{ item.title }}</a> | |||
@@ -12,7 +12,7 @@ | |||
<div class="content"> | |||
<div class="top"> | |||
<div id="videocar" class="lr"> | |||
<el-carousel :interval="5000" arrow="always" height="500px"> | |||
<el-carousel :interval="5000" arrow="always" height="470px"> | |||
<template v-for="item in hotList.left" > | |||
<el-carousel-item :key="item" v-if="item.split('.')[item.split('.').length - 1] === 'mp4'"> | |||
<video :src="item" /> | |||
@@ -21,7 +21,7 @@ | |||
</el-carousel> | |||
</div> | |||
<div id="hottxt" class="lr"> | |||
<el-carousel :interval="5000" height="500px"> | |||
<el-carousel :interval="5000" height="470px"> | |||
<el-carousel-item v-for="item in hotList.right" :key="item.title"> | |||
<div class="txtcontent"> | |||
<div class="title"> | |||
@@ -55,15 +55,18 @@ | |||
<el-button plain class="more" size="small">MORE</el-button> | |||
</div> | |||
</div> | |||
<div class="yyzrbimg lr" :style="{ backgroundImage: `url(${daliay.img})` }"/> | |||
<div class="yyzrbimg lr" > | |||
<img :src="daliay.img" alt=""> | |||
</div> | |||
</div> | |||
<div class="bottom" :style="{ backgroundImage: `url(${gg2})` }"/> | |||
</div> | |||
</div> | |||
<div id="wk"> | |||
<a :href="alink" target="_blank"> | |||
<el-button type="primary" class="wkbtn" size="medium">点击进入</el-button> | |||
</a> | |||
<a :href="alink" target="_blank"> | |||
<img src="@/assets/wk.png" alt=""> | |||
<el-button type="primary" class="wkbtn" size="medium">点击进入</el-button> | |||
</a> | |||
</div> | |||
</div> | |||
</template> | |||
@@ -191,14 +194,13 @@ export default { | |||
} | |||
#hot, #daliay { | |||
width: 100%; | |||
height: 700px; | |||
background: #E3E5EA; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
padding: 30px 0; | |||
.content { | |||
width: 60%; | |||
min-width: 1100px; | |||
width: 1200px; | |||
height: 90%; | |||
display: flex; | |||
flex-direction: column; | |||
@@ -207,9 +209,10 @@ export default { | |||
width: 100%; | |||
} | |||
.top { | |||
min-height: 470px; | |||
// min-height: 470px; | |||
// background: black; | |||
display: flex; | |||
padding-bottom: 30px; | |||
.lr { | |||
width: 50%; | |||
height: 100%; | |||
@@ -283,6 +286,7 @@ export default { | |||
min-height: 120px; | |||
background-image: url('../../assets/bottom.png'); | |||
background-size: 100% 100%; | |||
margin-top: 30px; | |||
} | |||
} | |||
} | |||
@@ -337,19 +341,22 @@ export default { | |||
} | |||
} | |||
.yyzrbimg { | |||
background-image: url('../../assets/yyzrb.png'); | |||
background-size: 100% 100%; | |||
// background-image: url('../../assets/yyzrb.png'); | |||
// background-size: 100% 100%; | |||
width: 50% !important; | |||
img{ | |||
width: 640px; | |||
height: 438px; | |||
} | |||
} | |||
} | |||
} | |||
#wk { | |||
background-image: url('../../assets/wk.png'); | |||
width: 100%; | |||
// min-width: 1920px; | |||
height: 830px; | |||
background-size: 100% 100%; | |||
position: relative; | |||
img { | |||
width: 100%; | |||
} | |||
.el-button--primary { | |||
width: 200px; | |||
height: 60px; | |||
@@ -360,8 +367,9 @@ export default { | |||
font-weight: 400; | |||
color: #FFFFFF; | |||
position: absolute; | |||
top: 70%; | |||
left: 45%; | |||
bottom: 10%; | |||
left: 50%; | |||
margin-left: -100px; | |||
} | |||
} | |||
</style> | |||
@@ -1,6 +1,6 @@ | |||
<template> | |||
<div> | |||
<el-carousel height="590px"> | |||
<el-carousel > | |||
<el-carousel-item class="lunbo" v-for="(item, index) in carouselList" :key="index" :style="{ backgroundImage: `url(${item.src})` }"> | |||
<div id="txt"> | |||
<a class="title">{{ item.title }}</a> | |||
@@ -260,8 +260,7 @@ export default { | |||
flex-direction: column; | |||
justify-content: center; | |||
.content { | |||
min-width: 1100px; | |||
width: 60%; | |||
width: 1200px; | |||
height: 90%; | |||
display: flex; | |||
flex-direction: column; | |||
@@ -1,6 +1,6 @@ | |||
<template> | |||
<div> | |||
<el-carousel height="590px"> | |||
<el-carousel > | |||
<el-carousel-item class="lunbo" v-for="(item, index) in carouselList" :key="index" :style="{ backgroundImage: `url(${item.src})` }"> | |||
<div id="txt"> | |||
<a class="title">{{ item.title }}</a> | |||
@@ -231,15 +231,14 @@ export default { | |||
} | |||
#hot, #daliay, #wk { | |||
width: 100%; | |||
height: 700px; | |||
background: #E3E5EA; | |||
display: flex; | |||
align-items: center; | |||
flex-direction: column; | |||
justify-content: center; | |||
padding-top: 30px;; | |||
.content { | |||
min-width: 1100px; | |||
width: 60%; | |||
width: 1200px; | |||
height: 90%; | |||
display: flex; | |||
flex-direction: column; | |||
@@ -248,8 +247,7 @@ export default { | |||
width: 100%; | |||
} | |||
.top { | |||
min-height: 470px; | |||
margin-bottom: 40px; | |||
margin-bottom: 30px; | |||
background-color: #FFFFFF; | |||
display: flex; | |||
#imgtxt { | |||
@@ -350,8 +348,7 @@ export default { | |||
#hot { | |||
.content { | |||
.top { | |||
min-height: 470px; | |||
margin-bottom: 40px; | |||
margin-bottom: 30px; | |||
background-color: #FFFFFF; | |||
display: flex; | |||
background-image: url('../../assets/hotTopLeft.png'); | |||
@@ -385,7 +382,6 @@ export default { | |||
} | |||
} | |||
#wk { | |||
height: 500px; | |||
.content { | |||
background-color: #FFFFFF; | |||
} | |||
@@ -458,6 +454,7 @@ export default { | |||
flex-direction: row !important; | |||
align-items: center; | |||
justify-content: center; | |||
margin-bottom: 30px; | |||
.txt { | |||
display: flex; | |||