如何解决我的字体大小根据项目的数量而变化
我为我的网站创建了一个移动部分(它不使用 @media,因为它是网站的另一部分,我更喜欢做一个不同的视图),除了我的字体大小搞砸了,但很多.
例如,当您必须滚动页面时,某些项目的字体大小变得太大或太小,我不知道这是从哪里来的?
喜欢什么:
1/2 项:
2 个或更多项目:
我的代码:
.page-mnu
{
padding: 15.2vh 1.2vh;
animation-name: arrivedroite;
animation-duration: 0.8s;
animation-delay: 0.3s;
opacity: 0;
transition: 0.8s;
font-size: 2.8rem;
}
.box-show {
display: flex;
flex-direction: column;
margin: 2.8rem 0;
}
.box-ind {
border: 0.2rem solid black;
margin: 1.3rem 0;
}
.tt-box {
display: flex;
align-items: center;
justify-content: center;
color: white;
width: 100%;
height: 5.2vh;
font-size: 2.1rem;
}
.cnt-box {
font-size: 1.8rem;
padding: 1.2rem;
}
<div class="page-mnu">
<b>Bonjour NOM - PRENOM</b>
<div class="box-show">
<div class="box-ind" style="border-color: #22248EFF;">
<div class="tt-box" style="background: #22248EFF;">Infos de l'établissement</div>
<div class="cnt-box"><i>Aucune information pour le moment</i></div>
</div>
<div class="box-ind" style="border-color: #22248EFF;">
<div class="tt-box" style="background: #22248EFF;">Infos de l'établissement</div>
<div class="cnt-box"><i>Aucune information pour le moment</i></div>
</div>
<div class="box-ind" style="border-color: #22248EFF;">
<div class="tt-box" style="background: #22248EFF;">Infos de l'établissement</div>
<div class="cnt-box"><i>Aucune information pour le moment</i></div>
</div>
<div class="box-ind" style="border-color: #22248EFF;">
<div class="tt-box" style="background: #22248EFF;">Infos de l'établissement</div>
<div class="cnt-box"><i>Aucune information pour le moment</i></div>
</div>
<div class="box-ind" style="border-color: #22248EFF;">
<div class="tt-box" style="background: #22248EFF;">Infos de l'établissement</div>
<div class="cnt-box"><i>Aucune information pour le moment</i></div>
</div>
<div class="box-ind" style="border-color: #22248EFF;">
<div class="tt-box" style="background: #22248EFF;">Infos de l'établissement</div>
<div class="cnt-box"><i>Aucune information pour le moment</i></div>
</div>
</div>
</div>
解决方法
糟糕,我忘记了元视口,还是谢谢你!
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。