微调横幅

This commit is contained in:
zhcnyuyang 2025-05-03 20:47:37 +08:00
parent 4f62c6e8b1
commit 7f60c1a1eb
5 changed files with 20 additions and 10 deletions

View File

@ -1,7 +1,10 @@
<template> <template>
<div class="pageroot" id="aboutusroot"> <div class="pageroot" id="aboutusroot">
<div id="abubanner" class="pagebanner"> <div id="abubanner" class="pagebanner">
<div class="bannercontent">
<span class="banner1">多年专业深耕<br /></span>
<span class="banner2">赋能客户产品体验创新</span>
</div>
</div> </div>
</div> </div>
</template> </template>

View File

@ -1,7 +1,10 @@
<template> <template>
<div class="pageroot" id="examplesprocessroot"> <div class="pageroot" id="examplesprocessroot">
<div id="examplesprocessbanner" class="pagebanner"> <div id="examplesprocessbanner" class="pagebanner">
<div class="bannercontent">
<span class="banner1">助力不同行业客户<br /></span>
<span class="banner2">实现业务增长和竞争力提升</span>
</div>
</div> </div>
</div> </div>
</template> </template>

View File

@ -2,8 +2,8 @@
<div id="homepageroot" class="pageroot"> <div id="homepageroot" class="pageroot">
<div id="hpbanner" class="pagebanner"> <div id="hpbanner" class="pagebanner">
<div class="bannercontent"> <div class="bannercontent">
<span class="banner1">以体验设计重构用户关系<br /></span> <span class="banner1">为用户创造美好体验<br /></span>
<span class="banner2">流量收割转向价值共生</span> <span class="banner2">驱动商业可持续增长</span>
</div> </div>
</div> </div>
</div> </div>

View File

@ -2,7 +2,8 @@
<div class="pageroot" id="serviceprocessroot"> <div class="pageroot" id="serviceprocessroot">
<div id="serviceprocessbanner" class="pagebanner"> <div id="serviceprocessbanner" class="pagebanner">
<div class="bannercontent"> <div class="bannercontent">
<span class="banner1">以体验设计重构用户关系<br /></span>
<span class="banner2">流量收割转向价值共生</span>
</div> </div>
</div> </div>
</div> </div>

View File

@ -17,23 +17,26 @@
width: 100%; width: 100%;
background-size:100% 100%; background-size:100% 100%;
background-attachment: scroll; background-attachment: scroll;
background-size: 100% 100%; /* 图片宽高100%填充div */ background-size: 100%; /* 图片宽高100%填充div */
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center center; background-position: center center;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
max-height: 100vh;
@include media-breakpoint-between(xs, md) { @include media-breakpoint-between(xs, md) {
//padding-bottom: 192%; //padding-bottom: 192%;
padding-top: 96%; //padding-top: 96%;
padding-bottom: 96%; //padding-bottom: 96%;
aspect-ratio: 0.526673640167364;
} }
@include media-breakpoint-up(md) { @include media-breakpoint-up(md) {
//padding-bottom: 52.6673640167364%; //padding-bottom: 52.6673640167364%;
padding-top: 26.3336820083682%; //padding-top: 26.3336820083682%;
padding-bottom: 26.3336820083682%; //padding-bottom: 26.3336820083682%;
aspect-ratio: 1.92;
} }
.bannercontent{ .bannercontent{