Skip to content

E
exhibition_page
提交 b2ac4dc6 authored 作者: 龙菲's avatar 龙菲
浏览文件
操作

优化夜郎的疑问和教育史馆精品展加载体验

上级 4a26622c
显示空白字符变更
内嵌 并排
正在显示 包含 103 行增加 和 143 行删除
src/views/boutique/components/YLGDYW.vue
浏览文件 @ b2ac4dc6
...@@ -2,43 +2,25 @@ ...@@ -2,43 +2,25 @@
<div class="ylg"> <div class="ylg">
<div class="face-and-intro"> <div class="face-and-intro">
<div class="bg"> <div class="bg">
<img src="@/assets/imgs/boutique/ylgdyw/1_faceImage/bg.jpg" alt="" /> <img src="@/assets/imgs/boutique/ylgdyw/1_faceImage/bg-low.png" alt="" />
</div> </div>
<div <div class="cr-1 wow animate__animated animate__fadeInRight" data-wow-duration="1s">
class="cr-1 wow animate__animated animate__fadeInRight" <img src="@/assets/imgs/boutique/ylgdyw/1_faceImage/cr-1-low.png" alt="" />
data-wow-duration="1s"
>
<img
src="@/assets/imgs/boutique/ylgdyw/1_faceImage/cr-1.png"
alt=""
/>
</div> </div>
<div class="cr-2 wow animate__animated animate__fadeInLeft"> <div class="cr-2 wow animate__animated animate__fadeInLeft">
<img <img src="@/assets/imgs/boutique/ylgdyw/1_faceImage/cr-2-low.png" alt="" />
src="@/assets/imgs/boutique/ylgdyw/1_faceImage/cr-2.png"
alt=""
/>
</div> </div>
<div class="title-group"> <div class="title-group">
<div class="subtitle wow animate__animated animate__fadeInLeft"> <div class="subtitle wow animate__animated animate__fadeInLeft">
<img <img src="@/assets/imgs/boutique/ylgdyw/1_faceImage/subtitle.png" alt="" />
src="@/assets/imgs/boutique/ylgdyw/1_faceImage/subtitle.png"
alt=""
/>
</div> </div>
<div class="title wow animate__animated animate__fadeInLeft"> <div class="title wow animate__animated animate__fadeInLeft">
<img <img src="@/assets/imgs/boutique/ylgdyw/1_faceImage/title.png" alt="" />
src="@/assets/imgs/boutique/ylgdyw/1_faceImage/title.png"
alt=""
/>
</div> </div>
</div> </div>
<div class="intro wow animate__animated animate__fadeIn"> <div class="intro wow animate__animated animate__fadeIn">
<div class="intro-title"> <div class="intro-title">
<img <img src="@/assets/imgs/boutique/ylgdyw/1_faceImage/intro-title.png" alt="" />
src="@/assets/imgs/boutique/ylgdyw/1_faceImage/intro-title.png"
alt=""
/>
</div> </div>
<div class="intro-content"> <div class="intro-content">
<div> <div>
...@@ -54,47 +36,31 @@ ...@@ -54,47 +36,31 @@
</div> </div>
<div class="map-group"> <div class="map-group">
<div class="map wow animate__animated animate__fadeInUp"> <div class="map wow animate__animated animate__fadeInUp">
<img <img src="@/assets/imgs/boutique/ylgdyw/1_faceImage/map-low.png" alt="" />
src="@/assets/imgs/boutique/ylgdyw/1_faceImage/map.png"
alt=""
/>
</div> </div>
<div class="under-map"> <div class="under-map">
<img <img src="@/assets/imgs/boutique/ylgdyw/1_faceImage/under-map-low.png" alt="" />
src="@/assets/imgs/boutique/ylgdyw/1_faceImage/under-map.png"
alt=""
/>
</div> </div>
</div> </div>
<div class="units"> <div class="units">
<div class="line wow animate__animated animate__fadeInleft"></div> <div class="line wow animate__animated animate__fadeInleft"></div>
<div class="node wow animate__animated animate__fadeInUp"> <div class="node wow animate__animated animate__fadeInUp">
<div <div :class="{
:class="{
'node-item': true, 'node-item': true,
active: currentUnit.title == item.title, active: currentUnit.title == item.title,
}" }" v-for="(item, index) in unitList" :key="index" @click="handleClickNode(item)"
v-for="(item, index) in unitList" @mouseenter="handleEnterUnit(item)" @mouseleave="handleMouseLeave(item)">
:key="index"
@click="handleClickNode(item)"
@mouseenter="handleEnterUnit(item)"
@mouseleave="handleMouseLeave(item)"
>
<div class="dot-group"> <div class="dot-group">
<div class="inner-dot"></div> <!-- <div class="inner-dot"></div>
<div class="outter-circle"></div> <div class="outter-circle"></div> -->
</div> </div>
<div class="text"> <div class="text">
<img <img :src="
:src=" require(`@/assets/imgs/boutique/ylgdyw/2_unit/${currentUnit == item || currentHoverItem == item
require(`@/assets/imgs/boutique/ylgdyw/2_unit/${
currentUnit == item || currentHoverItem == item
? item.img + '-s' ? item.img + '-s'
: item.img : item.img
}.png`) }.png`)
" " alt="" />
alt=""
/>
</div> </div>
</div> </div>
</div> </div>
...@@ -106,17 +72,13 @@ ...@@ -106,17 +72,13 @@
</div> </div>
</div> </div>
<div class="unit-cr"> <div class="unit-cr">
<div <div :class="{
:class="{
'unit-cr-group': true, 'unit-cr-group': true,
'flex-end wow animate__animated animate__fadeInRight': 'flex-end wow animate__animated animate__fadeInRight':
key == 0 || key == 2, key == 0 || key == 2,
'flex-start wow animate__animated animate__fadeInLeft': 'flex-start wow animate__animated animate__fadeInLeft':
key == 1, key == 1,
}" }" v-for="(v, key) in currentUnit.culturalRelic" :key="key">
v-for="(v, key) in currentUnit.culturalRelic"
:key="key"
>
<div class="cr-container" @click="handleClickCr(v)"> <div class="cr-container" @click="handleClickCr(v)">
<div class="left-info" v-if="key == 0"> <div class="left-info" v-if="key == 0">
<div class="source"> <div class="source">
...@@ -135,24 +97,15 @@ ...@@ -135,24 +97,15 @@
</div> </div>
<div class="right-cr-img"> <div class="right-cr-img">
<div class="img-container"> <div class="img-container">
<img <img :src="
:src="
require(`@/assets/imgs/boutique/ylgdyw/2_unit/${v.imgName}`) require(`@/assets/imgs/boutique/ylgdyw/2_unit/${v.imgName}`)
" " alt="" />
alt=""
/>
</div> </div>
<div class="left-line" v-if="key == 0"> <div class="left-line" v-if="key == 0">
<img <img src="@/assets/imgs/boutique/ylgdyw/2_unit/right-line.png" alt="" />
src="@/assets/imgs/boutique/ylgdyw/2_unit/right-line.png"
alt=""
/>
</div> </div>
<div class="right-line" v-if="key == 1"> <div class="right-line" v-if="key == 1">
<img <img src="@/assets/imgs/boutique/ylgdyw/2_unit/left-line.png" alt="" />
src="@/assets/imgs/boutique/ylgdyw/2_unit/left-line.png"
alt=""
/>
</div> </div>
</div> </div>
...@@ -177,18 +130,15 @@ ...@@ -177,18 +130,15 @@
</div> </div>
</div> </div>
<div class="gap-bg wow animate__animated animate__fadeIn"> <div class="gap-bg wow animate__animated animate__fadeIn">
<img src="@/assets/imgs/boutique/ylgdyw/3_museum/bg.png" alt="" /> <img src="@/assets/imgs/boutique/ylgdyw/3_museum/bg-low.png" alt="" />
</div> </div>
<div class="musuem"> <div class="musuem">
<div class="bg"> <div class="bg">
<img src="@/assets/imgs/boutique/ylgdyw/4_crs/bg.png" alt="" /> <img src="@/assets/imgs/boutique/ylgdyw/4_crs/bg-low.png" alt="" />
</div> </div>
<div class="info wow animate__animated animate__fadeInUp"> <div class="info wow animate__animated animate__fadeInUp">
<div class="musuem-title"> <div class="musuem-title">
<img <img src="@/assets/imgs/boutique/ylgdyw/3_museum/title.png" alt="" />
src="@/assets/imgs/boutique/ylgdyw/3_museum/title.png"
alt=""
/>
</div> </div>
<div class="musuem-intro"> <div class="musuem-intro">
黔西南州博物馆位于兴义市桔山广场，共计10000余平方米，为正科级公益性文化事业单位，设有陈列展览部、社会教育部、文物保护部、征集保管部、安全保卫部、文创研发部等部室。馆藏文物4500余件（套），其中一级文物32件（套），二级文物15件（套），三级文物60件（套）。精品文物有抚琴俑、铜车马、摇钱树、连枝灯、提梁壶、一字格剑等。现有基本陈列《夜郎的疑问-贵州汉代历史文物展》免费对公众开放，展览文物400余件（套），共三个单元六个展厅，展览面积3300平方米，为西南地区面积最大、珍贵文物较多的汉代文物专题展之一。 黔西南州博物馆位于兴义市桔山广场，共计10000余平方米，为正科级公益性文化事业单位，设有陈列展览部、社会教育部、文物保护部、征集保管部、安全保卫部、文创研发部等部室。馆藏文物4500余件（套），其中一级文物32件（套），二级文物15件（套），三级文物60件（套）。精品文物有抚琴俑、铜车马、摇钱树、连枝灯、提梁壶、一字格剑等。现有基本陈列《夜郎的疑问-贵州汉代历史文物展》免费对公众开放，展览文物400余件（套），共三个单元六个展厅，展览面积3300平方米，为西南地区面积最大、珍贵文物较多的汉代文物专题展之一。
...@@ -196,25 +146,14 @@ ...@@ -196,25 +146,14 @@
</div> </div>
<div class="cr-group wow animate__animated animate__fadeInUp"> <div class="cr-group wow animate__animated animate__fadeInUp">
<div class="title"> <div class="title">
<img <img src="@/assets/imgs/boutique/ylgdyw/4_crs/title.png" alt="" />
src="@/assets/imgs/boutique/ylgdyw/4_crs/title.png"
alt=""
/>
</div> </div>
<div class="cr-imgs-group"> <div class="cr-imgs-group">
<div <div class="cr-container" v-for="(item, index) in bottomCrList" :key="index" @click="handleClickCr(item)">
class="cr-container"
v-for="(item, index) in bottomCrList"
:key="index"
@click="handleClickCr(item)"
>
<div class="img-container"> <div class="img-container">
<img <img :src="
:src="
require(`@/assets/imgs/boutique/ylgdyw/4_crs/${item.imgName}`) require(`@/assets/imgs/boutique/ylgdyw/4_crs/${item.imgName}`)
" " alt="" />
alt=""
/>
</div> </div>
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
<div class="years">{{ item.years }}</div> <div class="years">{{ item.years }}</div>
...@@ -273,8 +212,8 @@ ...@@ -273,8 +212,8 @@
import MDialog from "@/components/MDialog"; import MDialog from "@/components/MDialog";
import videoPlayer from "@/components/VideoPlayer"; import videoPlayer from "@/components/VideoPlayer";
export default { export default {
components:{ components: {
MDialog,videoPlayer MDialog, videoPlayer
}, },
data() { data() {
return { return {
...@@ -288,14 +227,14 @@ export default { ...@@ -288,14 +227,14 @@ export default {
name: "猫猫洞遗址出土刮削器", name: "猫猫洞遗址出土刮削器",
years: "旧石器时代晚期", years: "旧石器时代晚期",
source: "1993年4月顶效镇猫猫洞出土", source: "1993年4月顶效镇猫猫洞出土",
imgName: "cr-1.png", imgName: "cr-1-low.png",
crId: "", crId: "",
}, },
{ {
name: "观音洞遗址出土砍砸器", name: "观音洞遗址出土砍砸器",
years: "旧石器时代晚期和新石器时代过度时期", years: "旧石器时代晚期和新石器时代过度时期",
source: "1993年4月龙广观音洞出土", source: "1993年4月龙广观音洞出土",
imgName: "cr-2.png", imgName: "cr-2-low.png",
crId: "", crId: "",
}, },
], ],
...@@ -309,14 +248,14 @@ export default { ...@@ -309,14 +248,14 @@ export default {
name: "一字格剑", name: "一字格剑",
years: "战国-西汉", years: "战国-西汉",
source: "1985年郑屯镇与龙广镇交界处出土", source: "1985年郑屯镇与龙广镇交界处出土",
imgName: "cr-3.png", imgName: "cr-3-low.png",
crId: "", crId: "",
}, },
{ {
name: "铜钟", name: "铜钟",
years: "战国-西汉", years: "战国-西汉",
source: "1984年万屯镇佐舍村出土", source: "1984年万屯镇佐舍村出土",
imgName: "cr-4.png", imgName: "cr-4-low.png",
crId: "", crId: "",
}, },
], ],
...@@ -330,14 +269,14 @@ export default { ...@@ -330,14 +269,14 @@ export default {
name: "摇钱树", name: "摇钱树",
years: "东汉", years: "东汉",
source: "1987年雨樟镇交乐6号墓出土", source: "1987年雨樟镇交乐6号墓出土",
imgName: "cr-5.png", imgName: "cr-5-low.png",
crId: "5b7d94b9e361404a94d25bc561ff284f", crId: "5b7d94b9e361404a94d25bc561ff284f",
}, },
{ {
name: "铜车马", name: "铜车马",
years: "东汉", years: "东汉",
source: "1987年雨樟镇交乐6号墓出土", source: "1987年雨樟镇交乐6号墓出土",
imgName: "cr-6.png", imgName: "cr-6-low.png",
crId: "3189ce3499564153897b648c19300b4f", crId: "3189ce3499564153897b648c19300b4f",
}, },
], ],
...@@ -352,13 +291,13 @@ export default { ...@@ -352,13 +291,13 @@ export default {
name: "猫猫洞遗址出土刮削器", name: "猫猫洞遗址出土刮削器",
years: "旧石器时代晚期", years: "旧石器时代晚期",
source: "1993年4月顶效镇猫猫洞出土", source: "1993年4月顶效镇猫猫洞出土",
imgName: "cr-1.png", imgName: "cr-1-low.png",
}, },
{ {
name: "观音洞遗址出土砍砸器", name: "观音洞遗址出土砍砸器",
years: "旧石器时代晚期和新石器时代过度时期", years: "旧石器时代晚期和新石器时代过度时期",
source: "1993年4月龙广观音洞出土", source: "1993年4月龙广观音洞出土",
imgName: "cr-2.png", imgName: "cr-2-low.png",
}, },
], ],
}, },
...@@ -369,7 +308,7 @@ export default { ...@@ -369,7 +308,7 @@ export default {
years: "战国-西汉", years: "战国-西汉",
made: "青铜", made: "青铜",
source: "1999年册亨岩架征集", source: "1999年册亨岩架征集",
imgName: "cr-1.png", imgName: "cr-1-low.png",
crId: "", crId: "",
}, },
{ {
...@@ -377,20 +316,20 @@ export default { ...@@ -377,20 +316,20 @@ export default {
years: "战国-西汉", years: "战国-西汉",
made: "青铜", made: "青铜",
source: "1987年安龙县大鱼塘（文昌宫旧址）出土", source: "1987年安龙县大鱼塘（文昌宫旧址）出土",
imgName: "cr-2.png", imgName: "cr-2-low.png",
crId: "c6413fd8eb3c408c811edcfb5fb9bc8a", crId: "fa08feaffa9d413e8443c078750c1193",
}, },
{ {
name: "一字格曲刃青铜剑", name: "一字格曲刃青铜剑",
years: "战国-西汉", years: "战国-西汉",
made: "青铜", made: "青铜",
source: "1997年郑屯与鲁屯的交界处", source: "1997年郑屯与鲁屯的交界处",
imgName: "cr-3.png", imgName: "cr-3-low.png",
crId: "166c3a120f55455587d75d6f34ae1d39", crId: "75ae4f4057f84c0a93c0c5c536667e44",
}, },
], ],
showVideo: false, showVideo: false,
src:'' src: ''
}; };
}, },
methods: { methods: {
...@@ -407,8 +346,9 @@ export default { ...@@ -407,8 +346,9 @@ export default {
}, },
handleClickCr(item) { handleClickCr(item) {
if (item.crId) { if (item.crId) {
const { crId } = item;
const newPage = this.$router.resolve({ const newPage = this.$router.resolve({
path: "culturalRelic/" + item.crId, path: "/culturalRelic/" + crId,
}); });
window.open(newPage.href, "_blank"); window.open(newPage.href, "_blank");
} else { } else {
...@@ -543,7 +483,7 @@ $themeYellow: #e7ce45; ...@@ -543,7 +483,7 @@ $themeYellow: #e7ce45;
width: 50%; width: 50%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 260px 60px 60px; padding: 260px 80px 60px;
.intro-title { .intro-title {
width: 328px; width: 328px;
...@@ -561,10 +501,10 @@ $themeYellow: #e7ce45; ...@@ -561,10 +501,10 @@ $themeYellow: #e7ce45;
color: #fff; color: #fff;
font-size: 20px; font-size: 20px;
font-weight: 500; font-weight: 500;
line-height: 1.5; line-height: 1.6;
text-indent: 40px; text-indent: 40px;
& > div { &>div {
margin-bottom: 8px; margin-bottom: 8px;
} }
} }
...@@ -586,7 +526,9 @@ $themeYellow: #e7ce45; ...@@ -586,7 +526,9 @@ $themeYellow: #e7ce45;
.line { .line {
width: 100%; width: 100%;
// height: 1px; // height: 1px;
border: 1px dashed $themeYellow; // border: 1px dashed $themeYellow;
height: 2px;
background-image: url(@/assets/imgs/boutique/ylgdyw/2_unit/line.png);
} }
.node { .node {
...@@ -600,29 +542,31 @@ $themeYellow: #e7ce45; ...@@ -600,29 +542,31 @@ $themeYellow: #e7ce45;
.dot-group { .dot-group {
position: absolute; position: absolute;
top: -25px; top: -25px;
left: 50%; left: 25%;
.inner-dot {
width: 35px;
height: 35px;
// background: $themeYellow;
background: #fff;
border-radius: 50%;
position: absolute;
left: 50%;
transform: translate(-50%, 25%);
}
.outter-circle {
width: 55px; width: 55px;
height: 55px; height: 55px;
// border: 3px dashed $themeYellow; background-image: url(@/assets/imgs/boutique/ylgdyw/2_unit/dot.png);
border: 3px dashed #fff; // .inner-dot {
border-radius: 50%; // width: 35px;
position: absolute; // height: 35px;
left: 50%; // // background: $themeYellow;
transform: translateX(-50%); // background: #fff;
} // border-radius: 50%;
// position: absolute;
// left: 50%;
// transform: translate(-50%, 25%);
// }
// .outter-circle {
// width: 55px;
// height: 55px;
// // border: 3px dashed $themeYellow;
// border: 3px dashed #fff;
// border-radius: 50%;
// position: absolute;
// left: 50%;
// transform: translateX(-50%);
// }
} }
.text { .text {
...@@ -645,7 +589,7 @@ $themeYellow: #e7ce45; ...@@ -645,7 +589,7 @@ $themeYellow: #e7ce45;
} }
.unit-content { .unit-content {
padding: 40px; padding: 60px 80px;
.unit-text { .unit-text {
width: 40%; width: 40%;
...@@ -659,7 +603,7 @@ $themeYellow: #e7ce45; ...@@ -659,7 +603,7 @@ $themeYellow: #e7ce45;
.content { .content {
font-size: 18px; font-size: 18px;
line-height: 1.5; line-height: 2;
} }
} }
...@@ -706,8 +650,8 @@ $themeYellow: #e7ce45; ...@@ -706,8 +650,8 @@ $themeYellow: #e7ce45;
margin: 0 80px; margin: 0 80px;
&:hover { &:hover {
& > .img-container { &>.img-container {
& > img { &>img {
transform: scale(1.1); transform: scale(1.1);
} }
} }
...@@ -881,10 +825,12 @@ $themeYellow: #e7ce45; ...@@ -881,10 +825,12 @@ $themeYellow: #e7ce45;
} }
} }
} }
.vr { .vr {
height: 800px; height: 800px;
display: flex; display: flex;
align-items: center; align-items: center;
.vr-content { .vr-content {
width: 100%; width: 100%;
// height: 100%; // height: 100%;
...@@ -895,6 +841,7 @@ $themeYellow: #e7ce45; ...@@ -895,6 +841,7 @@ $themeYellow: #e7ce45;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-around; justify-content: space-around;
.text { .text {
font-size: 20px; font-size: 20px;
padding: 20px 0; padding: 20px 0;
...@@ -904,6 +851,7 @@ $themeYellow: #e7ce45; ...@@ -904,6 +851,7 @@ $themeYellow: #e7ce45;
line-height: 65px; line-height: 65px;
letter-spacing: 4px; letter-spacing: 4px;
} }
.video-button { .video-button {
color: #fff; color: #fff;
font-size: 22px; font-size: 22px;
...@@ -917,11 +865,14 @@ $themeYellow: #e7ce45; ...@@ -917,11 +865,14 @@ $themeYellow: #e7ce45;
letter-spacing: 2px; letter-spacing: 2px;
cursor: pointer; cursor: pointer;
} }
.left, .left,
.right { .right {
width: 20%; width: 20%;
.img-container { .img-container {
width: 100%; width: 100%;
img { img {
width: 100%; width: 100%;
// height: 100%; // height: 100%;
...@@ -931,9 +882,11 @@ $themeYellow: #e7ce45; ...@@ -931,9 +882,11 @@ $themeYellow: #e7ce45;
.center { .center {
position: relative; position: relative;
.img-container { .img-container {
animation: changeright 4s linear infinite; animation: changeright 4s linear infinite;
} }
.text-content { .text-content {
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -945,6 +898,7 @@ $themeYellow: #e7ce45; ...@@ -945,6 +898,7 @@ $themeYellow: #e7ce45;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
.center-text { .center-text {
/* font-size: 40px; /* font-size: 40px;
font-weight: 500; font-weight: 500;
...@@ -952,10 +906,12 @@ $themeYellow: #e7ce45; ...@@ -952,10 +906,12 @@ $themeYellow: #e7ce45;
line-height: 50px; */ line-height: 50px; */
width: 334px; width: 334px;
height: 53px; height: 53px;
> img {
>img {
width: 100%; width: 100%;
} }
} }
.text-middle { .text-middle {
font-family: PingFang SC; font-family: PingFang SC;
color: #fff; color: #fff;
...@@ -964,9 +920,11 @@ $themeYellow: #e7ce45; ...@@ -964,9 +920,11 @@ $themeYellow: #e7ce45;
font-size: 32px; font-size: 32px;
} }
} }
.button { .button {
margin-top: 60px; margin-top: 60px;
cursor: pointer; cursor: pointer;
.outter { .outter {
width: 90px; width: 90px;
height: 90px; height: 90px;
...@@ -977,6 +935,7 @@ $themeYellow: #e7ce45; ...@@ -977,6 +935,7 @@ $themeYellow: #e7ce45;
border: 2px dashed#fff; border: 2px dashed#fff;
animation: likes 2.5s ease-in infinite; animation: likes 2.5s ease-in infinite;
transition: all ease-in 0.5s; transition: all ease-in 0.5s;
.inner { .inner {
width: 65px; width: 65px;
height: 65px; height: 65px;
...@@ -987,7 +946,8 @@ $themeYellow: #e7ce45; ...@@ -987,7 +946,8 @@ $themeYellow: #e7ce45;
align-items: center; align-items: center;
color: #fff; color: #fff;
font-weight: bold; font-weight: bold;
> i {
>i {
font-size: 32px; font-size: 32px;
} }
} }
......
src/views/boutique/components/jysg/index.vue
浏览文件 @ b2ac4dc6
...@@ -252,14 +252,14 @@ img { ...@@ -252,14 +252,14 @@ img {
} }
//common end //common end
.gysg { .gysg {
background-image: url("@/assets/imgs/boutique/jysg/bg.png"); background-image: url("@/assets/imgs/boutique/jysg/bg-low.png");
background-size: 100% 100%; background-size: 100% 100%;
height: 7720px; height: 7720px;
.part1 { .part1 {
position: relative; position: relative;
height: 1569px; height: 1569px;
width: 100%; width: 100%;
background-image: url("@/assets/imgs/boutique/jysg/part1/bg.png"); background-image: url("@/assets/imgs/boutique/jysg/part1/bg-low.png");
background-size: 100% 100%; background-size: 100% 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
...@@ -296,7 +296,7 @@ img { ...@@ -296,7 +296,7 @@ img {
.part2 { .part2 {
height: 3297px; height: 3297px;
width: 100%; width: 100%;
background-image: url("@/assets/imgs/boutique/jysg/part2/bg.png"); background-image: url("@/assets/imgs/boutique/jysg/part2/bg-low.png");
background-size: 100% 100%; background-size: 100% 100%;
.hall1 { .hall1 {
width: 100%; width: 100%;
...@@ -531,7 +531,7 @@ img { ...@@ -531,7 +531,7 @@ img {
.part5 { .part5 {
height: 1200px; height: 1200px;
background-image: url("@/assets/imgs/boutique/jysg/part5/bg.png"); background-image: url("@/assets/imgs/boutique/jysg/part5/bg-low.png");
background-size: 100% 100%; background-size: 100% 100%;
margin-top: 140px; margin-top: 140px;
display: flex; display: flex;
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论