[tailwind css/ windi css 用法讨论] width 大家是使用 w-2 还是 w-[8px] 这样的显示推断？
yuthelloworld · 2022-07-11 11:53:51 +08:00 · 1516 次点击这是一个创建于 858 天前的主题，其中的信息可能已经有所发展或是发生改变。
.w-2 {
width: 0.5rem;
}
.w-\[8px\] {
width: 8px;
}
rem 的使用场景是什么？用 w-2 这种默认用法，是不是需要 UI 设计的支持？
width: 0.5rem;
}
.w-\[8px\] {
width: 8px;
}
rem 的使用场景是什么？用 w-2 这种默认用法，是不是需要 UI 设计的支持？
 |
1
retrocode 2022-07-11 11:59:35 +08:00
rem 主要是响应式, 和移动页面 750 尺寸的适配
我是直接自己用 scss 写的库, w-* 默认就是 px, |
 |
2
yuthelloworld OP |
 |
3
nomagick 2022-07-11 12:27:30 +08:00  1
rem 等比放缩，大小根据 body 的字体大小动态决定，是标准的移动端适配手段
什么 wind 西北风系列前缀，是私自决定的，自作聪明的适配手段。 继前端不需要懂 DOM 之后现在终于前端也不需要懂 CSS 了，过两年是不是 js 也不需要懂了。 基础不牢地动山摇，你就会西北风系列过两年搞不好真得喝西北风 |
 |
6
TWorldIsNButThis 2022-07-11 13:57:01 +08:00 via iPhone
我是优先用预设的相对长度的样式
或者和设计共同商定你们系统里设计元素的 primitive |
 |
7
SingeeKing 2022-07-11 14:01:13 +08:00
标准缩放比例下，1rem=16px
有一些人可能在系统级别调整了文字大小，使用 rem 就可以保证让他们能看到正常想看到的大小 |
 |
8
marcong95 2022-07-11 14:02:36 +08:00 1
@nomagick #3 rem 等比缩放我觉得当年什么像素级还原的妖风邪气或者部分前端的偷懒操作，2022 年的正经页面估计没多少还在用（ iconfont.cn 前段时间还见过，现在也改回来了）。例如你一个 1920px 设计稿 14px 的文字，你要是写这种等比缩放的 rem ，用户把浏览器窗口化，或者在用一些奇奇怪怪的分辨率屏幕，例如近几年死灰复燃的 UMPC 或者叫 Windows 掌机，给你塞一个 1200px 的窗口，那你字体就只剩 8.75px ，触发 Chrome 最小字体限制，gg ，布局毁了。
响应式前缀的背后是 media query ，那才是正经的响应式布局的玩法。基础不牢地动山摇是指不懂框架背后的原理，而不是用的什么形式的套路做响应式布局。 |
|
10
nomagick 2022-07-11 14:19:55 +08:00
|
 |
11
sjhhjx0122 2022-07-11 15:38:28 +08:00
@nomagick 你不用变量的吗，我们适老化都是直接判断 body 上的名字维护两套变量，主题也是，实话实说 rem 除了更暴力更方便写，其他方面确实不如媒体查询，要不你看看越在乎美观的网站越会用媒体查询做各种尺寸的适应，
|
|
12
nomagick 2022-07-11 15:55:24 +08:00
@sjhhjx0122 别抬杠，这讨论的是 px vs rem ，维度都不一样，没说不让你用媒体查询和变量
|
|
13
sjhhjx0122 2022-07-11 16:27:56 +08:00
@nomagick 这不是抬杠啊，你说 px 到底都是，我说写 px 肯定用变量，不会写的到处都是
|
 |
14
gdrk 2022-07-11 17:37:19 +08:00
所以现在主流的可以一把梭的适配方案是啥啊，vw?
|
 |
15
menglizhi2333 2022-07-12 15:56:45 +08:00 1
@gdrk 一把梭，自适应不存在的，请让 UI 设计师根据屏幕宽度，设计大中小三个左右的组件设计稿，然后你用 flex 布局加媒体查询识别宽度，切换对应宽度的组件
|
Select Language