提交 50a6c0d7 authored 作者: 王鹏飞's avatar 王鹏飞

chore: 首页改版

上级 2e70eda2
...@@ -22,7 +22,7 @@ body { ...@@ -22,7 +22,7 @@ body {
'Hiragino Sans GB', 'Wenquanyi Micro Hei', sans-serif; 'Hiragino Sans GB', 'Wenquanyi Micro Hei', sans-serif;
padding: 0; padding: 0;
margin: 0; margin: 0;
background: #eee; background: #f9f8f8;
} }
p { p {
margin: 0; margin: 0;
......
<template> <template>
<div :class="isMobile ? 'is-h5' : 'is-pc'"> <div :class="isMobile ? 'is-h5' : 'is-pc'">
<div class="banner-content"> <div class="banner-content">
<img class="img" v-if="!isMobile" src="https://webapp-pub.ezijing.com/project/sbu-plus/pc-index-banner.png" /> <a href="/my" v-if="!isMobile">
<img class="img" src="https://webapp-pub.ezijing.com/project/sbu-plus/banner.png"
/></a>
<img class="img" v-else src="https://webapp-pub.ezijing.com/project/sbu-plus/h5/pc-index-banner1.png" /> <img class="img" v-else src="https://webapp-pub.ezijing.com/project/sbu-plus/h5/pc-index-banner1.png" />
<div class="banner_navList"> <div class="banner_navList" v-if="false">
<div class="banner_nav" v-for="(item, index) in navList" :key="index" @click="navClick(item)"> <div class="banner_nav" v-for="(item, index) in navList" :key="index" @click="navClick(item)">
<div class="nav_top"> <div class="nav_top">
<img class="nav_img" :src="item.img" v-if="!isMobile" /> <img class="nav_img" :src="item.img" v-if="!isMobile" />
...@@ -91,6 +93,8 @@ export default { ...@@ -91,6 +93,8 @@ export default {
.img { .img {
width: 100%; width: 100%;
height: 100%; height: 100%;
min-height: 650px;
object-fit: cover;
z-index: 1000; z-index: 1000;
} }
.banner_navList { .banner_navList {
......
...@@ -28,86 +28,39 @@ export default { ...@@ -28,86 +28,39 @@ export default {
return { return {
listData: [ listData: [
{ {
web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/pc-index-project-intro-01.png', web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/feature_1.png',
item_desc_tit: '公立常春藤大学', item_desc_tit: '公立常春藤大学',
item_desc_con: '全球大学排名前1%<br/>2021QS全美排名39<br/>US.NEWS.全美77' item_desc_con: '2021QS全美39位<br/>US.NEWS.全美88<br/>世界大学前1%'
}, },
{ {
web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/pc-index-project-intro-02.png', web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/feature_2.png',
item_desc_tit: '师资雄厚', item_desc_tit: '师资雄厚',
item_desc_con: '7位诺贝尔奖得主<br/>37位科学院院士<br/>1位图灵奖得主' item_desc_con: '7位诺贝尔奖得主<br/>37位科学院院士<br/>1位图灵奖得主'
}, },
{ {
web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/pc-index-project-intro-03.png', web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/feature_3.png',
item_desc_tit: '精英辈出', item_desc_tit: '精英辈出',
item_desc_con: item_desc_con: '斯坦福大学校长<br/>纽约时报CEO<br/>瑞士银行CTO等'
'瑞士银行CTO Scott G. Abbey <br/>高桥资本创始人 Glenn Dubin<br/>斯坦福大学第十任校长 John Hennessy'
}, },
{ {
web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/pc-index-project-intro-04.png', web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/feature_4.png',
item_desc_tit: '校方直录', item_desc_tit: '校方直录',
item_desc_con: '点对点直录<br/>硕士学分<br/>国内提前修' item_desc_con: '点对点直录<br/>硕士学分<br/>国内提前修'
}, },
{ {
web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/pc-index-project-intro-05.png', web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/feature_5.png',
item_desc_tit: '推免入学', item_desc_tit: '免标准化考试',
item_desc_con: '校方语言及科研课程<br/>免试托福/GMAT' item_desc_con: '美国校方考试<br/>替代托福/GMAT'
}, },
{ {
web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/pc-index-project-intro-06.png', web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/feature_6.png',
item_desc_tit: '位置优越', item_desc_tit: '省时省费',
item_desc_con: '位于纽约长岛,紧邻华尔街' item_desc_con: '仅需赴美学习1年<br/>校内住宿安全便捷'
}
],
swiperOption: {
observer: true,
observeParents: true,
speed: 400,
autoplay: true,
delay: 3000,
loop: true,
slidesPerView: 'auto',
centeredSlides: true,
spaceBetween: 20,
navigation: {
nextEl: '.next-button',
prevEl: '.prev-button'
}
},
titleParams: {
name: this.$t('home.project.title')
},
data: [
{
icon: 'https://webapp-pub.ezijing.com/project/marywood/img12.png',
iconActive: 'https://webapp-pub.ezijing.com/project/marywood/img11.png',
text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT5') : this.$t('home.project.pc.itemT5')
},
{
icon: 'https://webapp-pub.ezijing.com/project/marywood/img22.png',
iconActive: 'https://webapp-pub.ezijing.com/project/marywood/img21.png',
text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT6') : this.$t('home.project.pc.itemT6')
},
{
icon: 'https://webapp-pub.ezijing.com/project/marywood/img32.png',
iconActive: 'https://webapp-pub.ezijing.com/project/marywood/img31.png',
text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT7') : this.$t('home.project.pc.itemT7')
},
{
icon: 'https://webapp-pub.ezijing.com/project/marywood/img42.png',
iconActive: 'https://webapp-pub.ezijing.com/project/marywood/img411.png',
text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT8') : this.$t('home.project.pc.itemT8')
},
{
icon: 'https://webapp-pub.ezijing.com/project/marywood/img52.png',
iconActive: 'https://webapp-pub.ezijing.com/project/marywood/img51.png',
text: this.$store.state.isMobile ? this.$t('home.project.h5.itemT9') : this.$t('home.project.pc.itemT9')
} }
] ]
} }
}, }
methods: {}
} }
</script> </script>
...@@ -116,123 +69,48 @@ export default { ...@@ -116,123 +69,48 @@ export default {
.card-list { .card-list {
width: 1200px; width: 1200px;
position: relative; position: relative;
margin-top: 17px; margin-top: 26px;
display: flex; display: grid;
flex-wrap: wrap; grid-template-columns: repeat(3, 1fr);
justify-content: space-around; row-gap: 30px;
.card-item:nth-child(1) { column-gap: 30px;
.item_desc_tit {
width: 150px;
}
}
.card-item:nth-child(2) {
.item_desc_tit {
width: 85px;
}
}
.card-item:nth-child(3) {
.item_desc_tit {
width: 85px;
}
}
.card-item:nth-child(4) {
.item_desc_tit {
width: 85px;
}
}
.card-item:nth-child(5) {
.item_desc_tit {
width: 130px;
}
}
.card-item:nth-child(6) {
.item_desc_tit {
width: 85px;
}
}
.card-item { .card-item {
width: 380px; height: 280px;
height: 380px;
margin-bottom: 20px;
overflow: hidden;
position: relative; position: relative;
.item_media { .item_media {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
img { img {
transition: 0.3s; transition: 0.3s;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
&:after {
content: '';
display: block;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.6);
}
} }
.item_desc { .item_desc {
position: absolute; position: absolute;
left: 0; top: 70px;
top: 0; right: 35px;
right: 0; text-align: right;
bottom: 0; }
padding: 28px;
// background-color: #ededed;
opacity: 1;
display: flex;
flex-direction: column;
.item_desc_tit { .item_desc_tit {
font-size: 21px; display: inline-block;
font-weight: 600; padding-bottom: 10px;
color: #fff; font-size: 20px;
line-height: 36px; font-weight: 500;
text-align: left; color: #aa1941;
transition: 0.3s; line-height: 1;
transform: translateY(150px); border-bottom: 1px solid #aa1941;
white-space: nowrap;
} }
.item_desc_con { .item_desc_con {
margin-top: 20px;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
color: #fff; color: #424242;
margin-top: 34px;
line-height: 32px; line-height: 32px;
transform: translateY(290px);
transition: 0.3s;
}
}
}
.card-item {
.item_media {
img {
transform: scale(1.1);
}
}
.item_desc {
// background-color: #fff;
.item_desc_tit {
border-bottom: 1px solid #f3f4f4;
text-align: left;
transform: translateY(100px);
}
.item_desc_con {
transform: translateY(90px);
}
} }
} }
} }
.max-width-center { .max-width-center {
width: 1212px; width: 1200px;
margin: 64px auto 0; margin: 64px auto 0;
} }
} }
......
...@@ -2,50 +2,26 @@ ...@@ -2,50 +2,26 @@
<div class="max-width-center"> <div class="max-width-center">
<card title="学校简介"> <card title="学校简介">
<div class="desc"> <div class="desc">
<img src="https://webapp-pub.ezijing.com/project/sbu-plus/school_desc.png" class="desc-img" />
<p> <p>
纽约州立大学石溪分校(SBU),又名石溪大学。坐落于纽约市风景区长岛,紧邻世界500强聚集地与全球金融中心——华尔街。全球大学排名前1%、2023 纽约州立大学石溪分校(SBU),又名石溪大学。坐落于纽约市风景区长岛,紧邻世界500强聚集地与全球金融中心——华尔街。全球大学排名前1%、2023
U.S. News全美排名77、2021 QS全美排名39、培养出7位诺贝尔奖得主及37位科学院院士,享有“公立常春藤”的美誉。 U.S. News全美排名77、2021 QS全美排名39、培养出7位诺贝尔奖得主及37位科学院院士,享有“公立常春藤”的美誉。
</p> </p>
<br /> <br />
<p> <p>
石溪大学是美国著名的公立研究型大学,纽约州排名最高的公立大学。著名核物理学家、诺贝尔物理学奖获得者杨振宁在该校执教37年。诺贝尔经济学奖得主罗伯特·奥曼在该校任教并创建博弈论中心。斯坦福大学校长、纽约时报CEO、瑞士银行CTO等大量优秀校友毕业于石溪大学。石溪大学也是世界第一张核磁共振图像的诞生地。 石溪大学是美国著名的公立研究型大学,纽约州排名最高的公立大学。著名核物理学家、诺贝尔物理学奖获得者杨振宁在该校执教37年。诺贝尔经济学奖得主罗伯特·奥曼在该校任教并创建博弈论中心。斯坦福大学校长、纽约时报CEO、瑞士银行CTO等大量优秀校友毕业于石溪大学。石溪大学也是世界第一张核磁共振图像的诞生地。
</p> </p>
</div> </div>
</card> </card>
<card title="项目简介" style="margin-top: 64px;"> <card title="项目简介" style="margin-top: 60px;">
<div class="desc"> <div class="desc">
<!-- <p>
石溪大学金融硕士保研项目英文全称是Center of Entrepreneurial Finance-Conditional Admission Process to Master of
Science in
Finance,是石溪大学为金融硕士项目开设的特别录取通道。项目给予大三、大四在读的优秀本科生或往届生提前获得石溪大学金融硕士录取的机会,包含三大内容:
</p>
<br /> -->
<!-- <h4>1、校方直录</h4>
<p>
经报名材料审核与面试通过后,将直接收到校方(stonybrook.edu)保研项目录取通知书
</p>
<br />
<h4>
2、推免入学
</h4>
<p>
通过学习石溪大学与保研项目中国招生与教学中心提供的英语强化课程,可免试托福;通过接受石溪大学商学院教授在量化金融(Quantitative
Finance)等领域提供的科研训练,鼓励学生以增强科研能力替代应试,可免试商学院研究生入学考试(GMAT)。
</p>
<br />
<h4>
3、提前读研
</h4> -->
<p> <p>
该保研项目是纽约州立大学石溪分校金融硕士项目的特别录取通道。项目通过对学生的全面个性化评估和科研主题课程训练,鼓励学生以增强科研能力替代应试,减少商学院研究生入学考试对学生学习和科研的干扰。 该保研项目是纽约州立大学石溪分校金融硕士项目的特别录取通道。项目通过对学生的全面个性化评估和科研主题课程训练,鼓励学生以增强科研能力替代应试,减少商学院研究生入学考试对学生学习和科研的干扰。
</p> </p>
<br /> <br />
</div>
<div class="remark">
<p> <p>
石溪大学商学院官方唯一授权清控紫荆教育负责金融硕士保研项目在中国的招生与教学,详见石溪大学官网项目说明: 石溪大学商学院官方唯一授权清控紫荆教育负责金融硕士保研项目在中国的招生与教学,详见石溪大学官网项目说明:
<a href="https://www.stonybrook.edu/commcms/cef/CEF-Workshop/Collaboration" style="color:#aa1941" <a href="https://www.stonybrook.edu/commcms/cef/CEF-Workshop/Collaboration" target="_blank"
>https://www.stonybrook.edu/commcms/cef/CEF-Workshop/Collaboration</a >https://www.stonybrook.edu/commcms/cef/CEF-Workshop/Collaboration</a
> >
</p> </p>
...@@ -61,26 +37,28 @@ export default { ...@@ -61,26 +37,28 @@ export default {
components: { AppLink, Card }, components: { AppLink, Card },
data() { data() {
return {} return {}
}, }
methods: {}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.is-pc { .is-pc {
.max-width-center { .max-width-center {
width: 1212px; width: 1200px;
margin: 0 auto; margin: 0 auto;
padding-top: 168px; padding-top: 120px;
}
.desc-img {
float: right;
margin-left: 40px;
margin-top: -60px;
} }
.desc { .desc {
text-align: justify; text-align: justify;
font-size: 20px; padding: 28px 0;
line-height: 30px;
font-weight: 400;
padding: 28px 30px 0 30px;
p { p {
color: #666666; font-size: 18px;
color: #666;
line-height: 36px; line-height: 36px;
} }
} }
...@@ -97,7 +75,10 @@ export default { ...@@ -97,7 +75,10 @@ export default {
.max-width-center { .max-width-center {
padding: 0.2rem 0.3rem 0.2rem 0.3rem; padding: 0.2rem 0.3rem 0.2rem 0.3rem;
} }
.desc-img {
max-width: 100%;
margin-bottom: 20px;
}
.desc { .desc {
text-align: justify; text-align: justify;
font-size: 0.12rem; font-size: 0.12rem;
......
<template> <template>
<section class="section" v-if="!isMobile ? 'is-h5' : 'is-pc'"> <section class="section" v-if="!isMobile ? 'is-h5' : 'is-pc'">
<!-- <div class="swiper-content1" @mouseenter="swiperStop" @mouseleave="swiperStart"> --> <div class="video-list">
<div class="swiper-content1"> <div class="video-item" v-for="(item, index) in videoData" :key="index">
<!-- <div v-swiper:mySwiper1="swiperOption" ref="mySwiper"> --> <div class="video-item__poster">
<div class="swiper-wrapper"> <img :src="item.img" />
<div class="swiper-slide" v-for="(item, index) in videoData" :key="index"> <div class="play-icon" @click="handlePlay(item.video_url)"><i class="el-icon-caret-right"></i></div>
<video controls :poster="item.img">
<source :src="item.web_img_uri" type="video/mp4" />
</video>
</div> </div>
<div class="video-item__desc">
<h3>{{ item.title }}</h3>
<p>{{ item.desc }}</p>
</div>
</div>
</div>
<div class="video-player" v-if="playerVisible" @click="playerVisible = false">
<div class="video-player_inner" @click.stop>
<video :src="playUrl" autoplay controls ref="videoRef"></video>
</div> </div>
<!-- </div> -->
</div> </div>
</section> </section>
</template> </template>
<script> <script>
export default { export default {
layout: 'normal',
data() { data() {
const _this = this
return { return {
popupVisible: false,
videoData: [ videoData: [
// {
// img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video_sbu1.png',
// web_img_uri:
// 'https://webapp-pub.ezijing.com/project/sbu-plus/1.%20%E7%9F%B3%E6%BA%AA%E5%A4%A7%E5%AD%A6%E8%AE%A9%E5%AD%A6%E7%94%9F%E6%8B%A5%E6%9C%89%E6%9B%B4%E5%A5%BD%E6%9C%AA%E6%9D%A5.mp4'
// },
// {
// img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video_sbu2.png',
// web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/%E6%A0%A1%E5%9B%AD%E6%8E%A2%E6%AD%A5.mp4'
// },
// {
// img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video_sbu3.png',
// web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/%E7%A7%91%E7%A0%94%E4%BC%98%E5%8A%BF.mp4'
// },
// {
// img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video_sbu4.png',
// web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/%E7%9F%B3%E6%BA%AA%E6%95%99%E6%8E%88.mp4'
// }
// {
// img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video_sbu5.png',
// web_img_uri:
// 'https://webapp-pub.ezijing.com/project/sbu-plus/%E5%90%91%E5%BE%80%E7%9A%84%E7%94%9F%E6%B4%BB.mp4'
// }
{ {
img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video_sbu6.png', img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video/1.mp4?x-oss-process=video/snapshot,t_1000',
video_url: 'https://webapp-pub.ezijing.com/project/sbu-plus/video/1.mp4',
web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/0922%E7%9F%B3%E6%BA%AA2.mp4' title: '石溪大学金融硕士保研',
desc: '就读石溪大学金融硕士 体验多元世界文化 探索精彩世界'
}, },
{ {
img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video_sbu7.png', img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video/3.mp4?x-oss-process=video/snapshot,t_1000',
video_url: 'https://webapp-pub.ezijing.com/project/sbu-plus/video/3.mp4',
web_img_uri: 'https://webapp-pub.ezijing.com/project/sbu-plus/%E6%9B%BC%E5%B0%BC%2B%E8%92%8B.mp4' title: '石溪大学金融硕士保研',
desc: '石溪大学商学院院长 金融硕士保研项目介绍'
}, },
{ {
img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video_sbu8.png', img: 'https://webapp-pub.ezijing.com/project/sbu-plus/video/2.mp4?x-oss-process=video/snapshot,t_1000',
video_url: 'https://webapp-pub.ezijing.com/project/sbu-plus/video/2.mp4',
web_img_uri: title: '石溪大学金融硕士保研',
'https://webapp-pub.ezijing.com/project/sbu-plus/%E7%9F%B3%E6%BA%AA%E5%A4%A7%E5%AD%A6%E6%95%99%E6%8E%883%E4%B8%AA%E7%90%86%E7%94%B1.mp4' desc: '石溪大学教授 分享∃个选择石溪大学的理由'
} }
] ],
playUrl: '',
// swiperOption: { playerVisible: false
// observer: true,
// observeParents: true,
// speed: 400,
// autoplay: true,
// delay: 3000,
// loop: true,
// slidesPerView: 'auto',
// centeredSlides: true,
// spaceBetween: 1,
// on: {
// init() {
// _this.swiper.slideNext()
// }
// }
// }
} }
}, },
computed: { computed: {
// swiper() {
// return this.$refs.mySwiper.swiper
// },
isMobile() { isMobile() {
return this.$store.state.isMobile return this.$store.state.isMobile
} }
}, },
methods: { methods: {
// swiperStop() { handlePlay(url) {
// this.swiper.autoplay.stop() this.playUrl = url
// }, this.playerVisible = true
// swiperStart() { this.$nextTick(() => {
// this.swiper.autoplay.start() this.$refs.videoRef.play()
// } })
}
} }
} }
</script> </script>
...@@ -109,34 +68,120 @@ export default { ...@@ -109,34 +68,120 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.is-pc { .is-pc {
.section { .section {
max-width: 1212px; max-width: 1200px;
margin: 83px auto; margin: 70px auto;
.swiper-content1 {
margin-left: 60px;
.swiper-slide {
width: 360px;
height: 574px;
video {
height: 100%;
line-height: 100%;
} }
.video-list {
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 58px;
} }
.video-item {
background-color: #fff;
}
.video-item__poster {
position: relative;
img {
width: 100%;
height: 200px;
object-fit: cover;
}
.play-icon {
position: absolute;
left: 50%;
top: 50%;
width: 83px;
height: 83px;
background: rgba(66, 66, 66, 0.5);
border-radius: 50%;
color: #fff;
transform: translate(-50%, -50%);
display: flex;
align-items: center;
justify-content: center;
font-size: 40px;
cursor: pointer;
}
}
.video-item__desc {
padding: 20px;
h3 {
font-size: 22px;
color: #666;
}
p {
margin-top: 20px;
font-size: 18px;
color: #666;
} }
} }
} }
.is-h5 { .is-h5 {
.section { .video-list {
.swiper-content1 { margin: 0 20px;
overflow-x: auto; display: grid;
.swiper-slide { grid-template-columns: repeat(1, 1fr);
width: 3.3rem; column-gap: 58px;
height: 4.58rem; row-gap: 20px;
video { }
height: 100%; .video-item {
line-height: 100%; background-color: #fff;
} }
.video-item__poster {
position: relative;
img {
width: 100%;
height: 200px;
object-fit: cover;
} }
.play-icon {
position: absolute;
left: 50%;
top: 50%;
width: 83px;
height: 83px;
background: rgba(66, 66, 66, 0.5);
border-radius: 50%;
color: #fff;
transform: translate(-50%, -50%);
display: flex;
align-items: center;
justify-content: center;
font-size: 40px;
cursor: pointer;
} }
} }
.video-item__desc {
padding: 20px;
h3 {
font-size: 22px;
color: #666;
}
p {
margin-top: 20px;
font-size: 18px;
color: #666;
}
}
}
.video-player {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.5);
z-index: 1000;
display: flex;
align-items: center;
justify-content: center;
}
.video-player_inner {
max-width: 800px;
border-radius: 10px;
overflow: hidden;
video {
width: 100%;
}
} }
</style> </style>
...@@ -188,8 +188,6 @@ li { ...@@ -188,8 +188,6 @@ li {
} }
.head-nav-content { .head-nav-content {
height: 72px; height: 72px;
display: flex;
align-items: center;
} }
} }
</style> </style>
...@@ -161,12 +161,10 @@ export default { ...@@ -161,12 +161,10 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.nav-item-box { .nav-item-box {
padding-left: 11px;
display: flex; display: flex;
justify-content: space-between;
li { li {
position: relative; position: relative;
margin-right: 40px;
.name { .name {
line-height: 72px; line-height: 72px;
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论