此问题在此处已有答案:
CSS clamp() formula for font-size(2个答案)
19小时前关门了。
我刚发现clamp,想用它来设置字体大小。我想最小值为.8rem,移动的版。然后1 rem为理想大小,然后1.25rem当屏幕变大。但字体大小没有改变,在所有当我重新调整屏幕大小。
我尝试了钳(10px,15px,20px),它也不工作。
*{
margin: 0;
}
body{
background-color: rgb(118, 120, 245);
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}
.container{
background-color: white;
width: 60%;
max-width: 500px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
p{
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-size: clamp(1rem, .8rem, 1.5rem);
}
<div class="container">
<p>A Message You Would Like To Pass</p>
<input type="text">
<button>Submit</button>
<p>Last Message Delivered!</p>
<p>Hello World</p>
</div>
2条答案
按热度按时间w8f9ii691#
它的更好的钳(移动的,标准,桌面)输入值为移动和桌面。然后改变中间值根据情况。
egmofgnx2#
该函数有三个参数:最小值、优选值和最大允许值。
所以如果你的第一个值(1雷姆)比中间的值(Ideo 8雷姆)高,它就不起作用了。
我想你想要的是
顺便说一句,使用px作为第一个和最后一个值。