[css] 你有使用过vmax和vmin吗？说说你对它们的理解

最新推荐文章于 2025-01-07 09:30:00 发布

前端小歌谣

最新推荐文章于 2025-01-07 09:30:00 发布

阅读量1.6k

点赞数 1

分类专栏： # 前端面试题css目录汇总

本文链接：https://blog.csdn.net/weixin_43392489/article/details/113557044

版权

前端面试题css目录汇总专栏收录该内容

416 篇文章

订阅专栏

本文探讨了CSS中vmax和vmin单位的应用，详细解释了这两种单位如何根据视口的最大或最小尺寸来调整元素的大小，从而实现响应式设计。通过使用vmin单位，可以确保元素在不同屏幕尺寸下都能保持合适的宽高比。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

[css] 你有使用过vmax和vmin吗？说说你对它们的理解


    vmax和vmin都是相对于窗口大小的长度单位。
    100vmax相当于100%当前窗口长或者宽的长度，取其中最大值，vmin反之。
    如果css函数max()和min()普及后，100vmax相当于max(100vw, 100vh)

个人最常用的是vmin，可以在确保在保持宽高比的情况下，不论窗口如何缩放都可以不让元素超出窗口范围。