这是一个创建于 1548 天前的主题，其中的信息可能已经有所发展或是发生改变。
如题，看到有个帖子问 vue 如何同时适配 PC 和移动端，想到这个问题，
粗略想了一下，似乎工业领域没有什么通过一套响应式模板，放到移动和 PC 全都通用的例子？
比如我个人而言，经常有一种响应式需求是，
1 、比如我在 PC 端横屏，那么我希望有两个 DIV，分别占据屏幕左半边和右半边，
2 、如果是竖屏（或者屏幕宽度小于某个阈值以后），则一个 DIV 占据全部宽度，然后另一个 DIV 换到下一行。
我写的时候用 flex，平均分布，可以很轻松地实现上述条件 1，同时规定一个最小宽度以实现换行，但这样就没法满足条件 2 。
是不是响应式本身能力有限，不能负担比较完美的 PC 和移动一套模板体验
 |
1
AreYou0k 2020-09-02 16:27:10 +08:00
媒体查询用了吗. 你可以看看 vue 组件库都有这个响应式实现的
|
 |
2
murmur 2020-09-02 16:35:56 +08:00
不能，这个对设计要求非常高，要么土，要么特别精致没什么实际内容
典型的就苹果官网，大量的图片和宣传标语，他负责吹牛逼，你负责花钱，啥交互不一样，电脑平板显示大图，手机上两边切掉显示中间的核心内容，这些是可以相应的。 |
|
3
murmur 2020-09-02 16:37:06 +08:00
*更正：交互不一样-交互不需要
|
|
4
murmur 2020-09-02 16:40:42 +08:00
至于土的例子，比如 gitbook 的主题，手机上侧栏藏起来，这很好，但是他内容部分宽度只有 770px，实在太窄了，大量留白，减少内容宽度，以保证手机 pc 上显示效果都还行
|
 |
5
chotow 2020-09-02 16:43:39 +08:00
响应式是可以做到的，但对 CSS 的要求比较高。如果不是用爱做产品，几乎没人愿意去用心实现。
|
 |
6
kop1989 2020-09-02 16:46:05 +08:00
一般这种跨平台的都是直接两套 dom 树。
因为往往不光是样式的调整。更多的是显示的内容和信息量也不同，甚至操作逻辑也不同。 |
Select Language