[tailwind css/ windi css 用法讨论] width 大家是使用 w-2 还是 w-[8px] 这样的显示推断？

[yuthelloworld]

.w-2 {
width: 0.5rem;
}

.w-\[8px\] {
width: 8px;
}

rem 的使用场景是什么？用 w-2 这种默认用法，是不是需要 UI 设计的支持？

[retrocode]

rem 主要是响应式, 和移动页面 750 尺寸的适配

我是直接自己用 scss 写的库, w-* 默认就是 px,

[yuthelloworld]

@retrocode #1 响应式也不用 rem 了。本身的响应式断点前缀就是用来做响应式的。
譬如 https://mastergo.com/help/ 我看它在移动端下也没有改根字号

[nomagick]

rem 等比放缩，大小根据 body 的字体大小动态决定，是标准的移动端适配手段

什么 wind 西北风系列前缀，是私自决定的，自作聪明的适配手段。

继前端不需要懂 DOM 之后现在终于前端也不需要懂 CSS 了，过两年是不是 js 也不需要懂了。

基础不牢地动山摇，你就会西北风系列过两年搞不好真得喝西北风

[horizon]

@nomagick 你在说些什么

[anguiao]

@nomagick
最捞的就是等比缩放，你说我用个大屏手机是图什么呢？你就给我来个暴力缩放。

[TWorldIsNButThis]

我是优先用预设的相对长度的样式

或者和设计共同商定你们系统里设计元素的 primitive

[SingeeKing]

标准缩放比例下，1rem=16px

有一些人可能在系统级别调整了文字大小，使用 rem 就可以保证让他们能看到正常想看到的大小

[marcong95]

@nomagick #3 rem 等比缩放我觉得当年什么像素级还原的妖风邪气或者部分前端的偷懒操作，2022 年的正经页面估计没多少还在用（ iconfont.cn 前段时间还见过，现在也改回来了）。例如你一个 1920px 设计稿 14px 的文字，你要是写这种等比缩放的 rem ，用户把浏览器窗口化，或者在用一些奇奇怪怪的分辨率屏幕，例如近几年死灰复燃的 UMPC 或者叫 Windows 掌机，给你塞一个 1200px 的窗口，那你字体就只剩 8.75px ，触发 Chrome 最小字体限制，gg ，布局毁了。

响应式前缀的背后是 media query ，那才是正经的响应式布局的玩法。基础不牢地动山摇是指不懂框架背后的原理，而不是用的什么形式的套路做响应式布局。

[retrocode]

@anguiao #5 暴力缩放简单省成本呀, 不过一般都是只对布局等比缩放,如果是文章类的应用, 文字是不做放大的

[nomagick]

@marcong95 没见过改窗口大小自动调 rem 的，rem 的关键点在于统一，要多大的 UI 你自己调就是了，前端自己调整自己的显示大小，适老优化。

@anguiao 还有买个大屏手机就图分辨率大点的，那是你，也有买大屏手机图字体显示大一点的。

像前端自己提供选项调整自己的显示大小这种操作是不是没见过

西北风系列 px 大小，再来个 px 分割，px 到处都是，怎么做这个适老优化?
两份代码？等着被优化呗?

[sjhhjx0122]

@nomagick 你不用变量的吗，我们适老化都是直接判断 body 上的名字维护两套变量，主题也是，实话实说 rem 除了更暴力更方便写，其他方面确实不如媒体查询，要不你看看越在乎美观的网站越会用媒体查询做各种尺寸的适应，

[nomagick]

@sjhhjx0122 别抬杠，这讨论的是 px vs rem ，维度都不一样，没说不让你用媒体查询和变量

[sjhhjx0122]

@nomagick 这不是抬杠啊，你说 px 到底都是，我说写 px 肯定用变量，不会写的到处都是

[gdrk]

所以现在主流的可以一把梭的适配方案是啥啊，vw?

[menglizhi2333]

@gdrk 一把梭，自适应不存在的，请让 UI 设计师根据屏幕宽度，设计大中小三个左右的组件设计稿，然后你用 flex 布局加媒体查询识别宽度，切换对应宽度的组件