我们有大型 react 应用程序，没有使用任何 UI 框架，我们自己构建所有 UI 组件。
现在我们需要让登陆页面部分响应（它是应用程序的一部分），我们需要添加很多@media 查询。
我首先想到的是tailwind css 库，它可以帮助解决这个问题，它比bootstrap 和material UI 更轻量级。
但是我不确定在此包含一个用于响应的整个 UI 实用程序是否是最佳实践，或者如果没有，是否有其他方法可以在不处理大量 @media 查询的情况下实现响应？
回答1
您可以尝试使用 CSS 钳位功能。此函数接受
三个参数。第一个是最小 value，第二个
是首选 value 和最大 value。例如：
.element {
width: clamp(100px, 75%, 300px);
}以下是您如何对媒体查询执行完全相同的操作：
.element {
width: 75%;
}
@media (max-width: 768px) {
.element {
width: 100px;
}
}
@media (max-width: 1200px) {
.element {
width: 300px;
}
}以下是关于 CSS 钳位功能的文档链接：
https://developer.mozilla.org/en-US/docs/Web/CSS/clamp
我希望这对你有所帮助。