Vue 适配响应式布局，最佳实现应该怎么处理？

[miniyao]

媒体查询的话，每个页面都要写，组件化后怎么实现最佳？

[zqguo]

这跟 vue 没关系，rem 了解下 ？

[gdrk]

插眼等一个，我目前都是写在一个全局 css 文件里...

[maocat]

element ui

[xieqiang9408]

tailwind css 了解一下

[manami]

vue 搭配 bulma 香惨，更多请查看 https://bulma.io

[zhennann]

pc=mobile+pad，一套页面组件同时适配 pc 端和 mobile 端。效果演示： https://cabloy.com/zh-cn/articles/adaptive-layout.html

[murmur]

每次说 rem 、响应式的我都要把小米手机的横屏移动版拿来做例子，叫你们响应，叫你们 rem

[Hanser002]

单独写一个容器组件容器组件包含这些媒体查询 每个页面都套上这个组件
再简单点每个页面单独加一个媒体查询的类名

[SxqSachin]

tailwindcss

[GG668v26Fd55CP5W]

@manami 额这不就是另一个 bootstrap 吗？

[cwz346852114]

flex 布局 如果是 pc 端 建议 el 的栅格

[meldonization]

插眼等高人

[gzf6]

百分比和 flex, grid 可以解决大部分问题，布局好解决，但是文字的可读性是个问题，有些大得破坏布局，有些小得影响阅读，得不同设备调试，这方面媒体查询用的多点

[manami]

@falcon05 bulma 只需要写 css 就行了，不需要依赖 jq，bootstrap 需要等到版本 5 才去除 jq

[shakaraka]

@media 了解下

[dartabe]

扒 Walmart 和 Amazon 发现都用的 grid 布局

[zqx]

现在都倾向于不区分设备，一套代码，让浏览器去处理适配问题。
怎么让浏览器处理呢？
用 Flex 或 Grid 布局，浏览器厂商费了那么大力气研发这些新特性，就是为了让开发者少写兼容代码。
现在几乎用不到媒体查询，和性能优化的精灵图一样，已经是过时的技术了。
REM 更不是什么好方案，根据屏幕尺寸用脚本动态计算 font-size，哪个天才想出来的。浏览器为什么既支持 em 也支持 px，就是为了不同场景的用法，em 的官方用法就不是用来适配屏幕尺寸的

[wgbx]

flex Grid 媒体查询，rem 能做屁的响应式？

[meteor957]

@wgbx 应该是 媒询+rem

[yaphets666]

最近做了一个 calc 配合 vw 的