|
@@ -2,10 +2,12 @@ |
|
|
<div>
|
|
|
<div>
|
|
|
<el-carousel >
|
|
|
<el-carousel >
|
|
|
<el-carousel-item class="lunbo" v-for="(item, index) in carouselList" :key="index" :style="{ backgroundImage: `url(${item.src})` }">
|
|
|
<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>
|
|
|
|
|
|
<a class="subtitle">{{ item.subtitle }}</a>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<a :href="item.link">
|
|
|
|
|
|
<div id="txt">
|
|
|
|
|
|
<a class="title">{{ item.title }}</a>
|
|
|
|
|
|
<a class="subtitle">{{ item.subtitle }}</a>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</a>
|
|
|
</el-carousel-item>
|
|
|
</el-carousel-item>
|
|
|
</el-carousel>
|
|
|
</el-carousel>
|
|
|
<div id="hot">
|
|
|
<div id="hot">
|
|
@@ -110,8 +112,9 @@ export default { |
|
|
for (const iter of data.list) {
|
|
|
for (const iter of data.list) {
|
|
|
this.carouselList.push({
|
|
|
this.carouselList.push({
|
|
|
src: iter.image,
|
|
|
src: iter.image,
|
|
|
title: iter.link,
|
|
|
|
|
|
subtitle: iter.link
|
|
|
|
|
|
|
|
|
title: iter.title,
|
|
|
|
|
|
subtitle: iter.subtitle,
|
|
|
|
|
|
link: iter.link
|
|
|
})
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
@@ -203,6 +206,10 @@ export default { |
|
|
.lunbo {
|
|
|
.lunbo {
|
|
|
background-size: auto;
|
|
|
background-size: auto;
|
|
|
background-position: center;
|
|
|
background-position: center;
|
|
|
|
|
|
a{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
#hot, #daliay {
|
|
|
#hot, #daliay {
|
|
|
width: 100%;
|
|
|
width: 100%;
|
|
@@ -210,10 +217,10 @@ export default { |
|
|
display: flex;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
justify-content: center;
|
|
|
padding: 30px 0;
|
|
|
|
|
|
|
|
|
padding: 25px 0;
|
|
|
.content {
|
|
|
.content {
|
|
|
width: 1200px;
|
|
|
width: 1200px;
|
|
|
height: 90%;
|
|
|
|
|
|
|
|
|
// height: 90%;
|
|
|
display: flex;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
flex-direction: column;
|
|
|
justify-content: space-between;
|
|
|
justify-content: space-between;
|
|
@@ -224,7 +231,7 @@ export default { |
|
|
// min-height: 470px;
|
|
|
// min-height: 470px;
|
|
|
// background: black;
|
|
|
// background: black;
|
|
|
display: flex;
|
|
|
display: flex;
|
|
|
padding-bottom: 30px;
|
|
|
|
|
|
|
|
|
// padding-bottom: 30px;
|
|
|
.lr {
|
|
|
.lr {
|
|
|
width: 50%;
|
|
|
width: 50%;
|
|
|
height: 100%;
|
|
|
height: 100%;
|
|
@@ -316,17 +323,21 @@ export default { |
|
|
}
|
|
|
}
|
|
|
#daliay {
|
|
|
#daliay {
|
|
|
background: #F2F4F8;
|
|
|
background: #F2F4F8;
|
|
|
|
|
|
padding-top: 60px;
|
|
|
.top {
|
|
|
.top {
|
|
|
justify-content: space-between;
|
|
|
justify-content: space-between;
|
|
|
|
|
|
position: relative;
|
|
|
.yyzrbtxt, .yyzrbimg{
|
|
|
.yyzrbtxt, .yyzrbimg{
|
|
|
height: 100%;
|
|
|
height: 100%;
|
|
|
width: 47%;
|
|
|
width: 47%;
|
|
|
.txtcontent {
|
|
|
.txtcontent {
|
|
|
width: 100%;
|
|
|
|
|
|
height: 80% !important;
|
|
|
height: 80% !important;
|
|
|
text-align: left;
|
|
|
text-align: left;
|
|
|
|
|
|
margin-right: 50px;
|
|
|
|
|
|
margin-right: 50px;
|
|
|
.logo {
|
|
|
.logo {
|
|
|
margin-bottom: 30px;
|
|
|
|
|
|
|
|
|
margin-bottom: 50px;
|
|
|
|
|
|
margin-top: -18px;
|
|
|
}
|
|
|
}
|
|
|
.title {
|
|
|
.title {
|
|
|
border-left: 7px solid #07CAAF;
|
|
|
border-left: 7px solid #07CAAF;
|
|
@@ -334,7 +345,6 @@ export default { |
|
|
font-weight: bold;
|
|
|
font-weight: bold;
|
|
|
color: #0D1114;
|
|
|
color: #0D1114;
|
|
|
width: 90%;
|
|
|
width: 90%;
|
|
|
height: 79px;
|
|
|
|
|
|
text-align: left;
|
|
|
text-align: left;
|
|
|
padding-left:30px;
|
|
|
padding-left:30px;
|
|
|
|
|
|
|
|
@@ -346,12 +356,13 @@ export default { |
|
|
line-height: 30px;
|
|
|
line-height: 30px;
|
|
|
width: 100%;
|
|
|
width: 100%;
|
|
|
text-align: left;
|
|
|
text-align: left;
|
|
|
|
|
|
margin-top: 40px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.btn {
|
|
|
.btn {
|
|
|
height: 20%;
|
|
|
|
|
|
width:100%;
|
|
|
width:100%;
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
bottom: 55px;
|
|
|
.more {
|
|
|
.more {
|
|
|
position: absolute;
|
|
|
position: absolute;
|
|
|
left: 0px;
|
|
|
left: 0px;
|
|
|