提交 068aa843 authored 作者: matian's avatar matian

fix:页面优化

上级 c0afe980
No preview for this file type
...@@ -9,29 +9,33 @@ ...@@ -9,29 +9,33 @@
<div class="content-mian"> <div class="content-mian">
<div class="li"> <div class="li">
<div class="li-tit" v-html="$t('home.ranking.item1Tit')"></div> <div class="li-tit" v-html="$t('home.ranking.item1Tit')"></div>
<div class="li-tit1" v-html="$t('home.ranking.item1Tit1')"></div>
<div class="item"> <div class="item">
<div class="tit"><span>No.</span>1</div> <div class="tit"><span class="no">No.</span><span class="num">1</span></div>
<div class="p" v-html="$t('home.ranking.item1Txt1')"></div> <div class="p" v-html="$t('home.ranking.item1Txt1')"></div>
</div> </div>
<div class="item"> <div class="item">
<div class="tit"><span>No.</span>8</div> <div class="tit"><span class="no">No.</span><span class="num">8</span></div>
<div class="p" v-html="$t('home.ranking.item1Txt2')"></div> <div class="p" v-html="$t('home.ranking.item1Txt2')"></div>
</div> </div>
</div> </div>
<div class="li li_center"> <div class="li li_center">
<!-- <div class="li-tit" v-html="$t('home.ranking.item2Tit11')"></div> --> <!-- <div class="li-tit" v-html="$t('home.ranking.item2Tit11')"></div> -->
<div class="li-tit" v-html="$t('home.ranking.item2Tit12')"></div> <div class="li-tit2" v-html="$t('home.ranking.item2Tit12')"></div>
<div class="li-tit" v-html="$t('home.ranking.item2Tit13')"></div> <div class="li-tit2" v-html="$t('home.ranking.item2Tit13')"></div>
<div class="li-tit" v-html="$t('home.ranking.item2Tit14')"></div> <div class="li-tit2" v-html="$t('home.ranking.item2Tit14')"></div>
</div> </div>
<div class="li mar-t"> <div class="li mar-t">
<div class="li-tit" v-html="$t('home.ranking.item3Tit')"></div> <div class="li-tit" v-html="$t('home.ranking.item3Tit')"></div>
<div class="li-tit1" v-html="$t('home.ranking.item3Tit1')"></div>
<div class="item"> <div class="item">
<div class="tit"><span>No.</span>1</div> <div class="tit"><span class="no">2021.No.</span><span class="num">1</span></div>
<div class="p" v-html="$t('home.ranking.item3Txt1')"></div> <div class="p" v-html="$t('home.ranking.item3Txt1')"></div>
</div> </div>
<div class="item"> <div class="item">
<div class="tit"><span>No.</span>7</div> <div class="tit"><span class="no">2021.No.</span><span class="num">7</span></div>
<div class="p" v-html="$t('home.ranking.item3Txt2')"></div> <div class="p" v-html="$t('home.ranking.item3Txt2')"></div>
</div> </div>
</div> </div>
...@@ -82,7 +86,11 @@ export default { ...@@ -82,7 +86,11 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.li_center { .li_center {
align-self: center; // align-self: center;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
} }
.li { .li {
// width: 250px; // width: 250px;
...@@ -90,25 +98,42 @@ export default { ...@@ -90,25 +98,42 @@ export default {
.li-tit { .li-tit {
text-align: center; text-align: center;
font-size: 30px; font-size: 30px;
line-height: 1.5; line-height: 24px;
color: #fff; color: #fff;
font-weight: 400;
}
.li-tit1{
font-size: 28px;
font-weight: 300;
line-height: 24px;
color: #FFFFFF;
margin-top: 11px;
}
.li-tit2{
font-size: 28px;
font-weight: 500;
line-height: 70px;
color: #FFFFFF;
opacity: 1;
} }
.item { .item {
.tit { .tit {
padding-top: 46px; padding-top: 46px;
font-size: 48px; color: #FBFBFB;
line-height: 100%;
color: #ffffff;
text-align: center; text-align: center;
margin-bottom: 15px; margin-bottom: 15px;
span { line-height: 34px;
.no {
font-size: 24px; font-size: 24px;
} }
.num{
font-size: 48px;
}
} }
.p { .p {
text-align: center; text-align: center;
font-size: 16px; font-size: 16px;
line-height: 30px; line-height: 24px;
color: #ffffff; color: #ffffff;
} }
} }
......
...@@ -54,9 +54,12 @@ export default { ...@@ -54,9 +54,12 @@ export default {
}, },
ranking: { ranking: {
title: '学校排名', title: '学校排名',
item1Tit: '瑞士美食艺术管理大学 <br/>Culinary Arts Academy Switzerland', item1Tit: '瑞士美食艺术管理大学 <br/>',
item1Tit1:'CULINARY ARTS ACADEMY SWITZERLAND',
// item2Tit: 'KELLEY 商学院', // item2Tit: 'KELLEY 商学院',
item3Tit: '瑞士恺撒里兹大学 <br/>César Ritz Collage Switzerland', item3Tit: '瑞士恺撒里兹大学 ',
item3Tit1: 'CÉSAR RITZ COLLAGE SWITZERLAND',
item1Txt1: '唯一进入全球款待业与休闲专业排名的美食艺术院校<br/>【2021年QS排名】', item1Txt1: '唯一进入全球款待业与休闲专业排名的美食艺术院校<br/>【2021年QS排名】',
item1Txt2: '全休款待业与休闲管理院校<br/>【2021年QS排名】', item1Txt2: '全休款待业与休闲管理院校<br/>【2021年QS排名】',
item2Tit11: '顶尖双校合作项目', item2Tit11: '顶尖双校合作项目',
......
...@@ -54,9 +54,11 @@ export default { ...@@ -54,9 +54,11 @@ export default {
}, },
ranking: { ranking: {
title: '学校排名', title: '学校排名',
item1Tit: '瑞士美食艺术管理大学 <br/>Culinary Arts Academy Switzerland', item1Tit: '瑞士美食艺术管理大学 ',
item1Tit1:'CULINARY ARTS ACADEMY SWITZERLAND',
// item2Tit: 'KELLEY 商学院', // item2Tit: 'KELLEY 商学院',
item3Tit: '瑞士恺撒里兹大学 <br/>César Ritz Collage Switzerland', item3Tit: '瑞士恺撒里兹大学',
item3Tit1: 'CÉSAR RITZ COLLAGE SWITZERLAND',
item1Txt1: '唯一进入全球款待业与休闲专业排名的美食艺术院校<br/>【2021年QS排名】', item1Txt1: '唯一进入全球款待业与休闲专业排名的美食艺术院校<br/>【2021年QS排名】',
item1Txt2: '全休款待业与休闲管理院校<br/>【2021年QS排名】', item1Txt2: '全休款待业与休闲管理院校<br/>【2021年QS排名】',
item2Tit11: '顶尖双校合作项目', item2Tit11: '顶尖双校合作项目',
......
...@@ -139,14 +139,17 @@ export default { ...@@ -139,14 +139,17 @@ export default {
margin-bottom: 40px; margin-bottom: 40px;
h2 { h2 {
font-size: 22px; font-size: 22px;
text-align: center; text-align: left;
color: #aa1941; color: #333;
line-height: 34px;
font-weight: 500;
} }
p { p {
margin-top: 20px; margin-top: 22px;
font-size: 16px; font-size: 16px;
line-height: 1.5; line-height: 27px;
color: #424242; color: #707070;
font-weight: 300;
} }
} }
.is-pc { .is-pc {
......
差异被折叠。
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论