V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
romancekami
V2EX  ›  程序员

前端菜鸟想问下在电脑端写的页面如何适配移动端?(不用管电脑端如何显示,只要手机端正常显示就行) 要用啥布局吗,感觉手机端单位是不是一般不用 px?

  •  1
     
  •   romancekami · 2022-01-22 21:51:23 +08:00 · 1198 次点击
    这是一个创建于 1040 天前的主题,其中的信息可能已经有所发展或是发生改变。

    电脑端正常显示如下:

    手机端情况如下:
    在电脑端写的页面 到了手机浏览器上显示元素会过宽 居中什么的也不对了

    Pooc
        1
    Pooc  
       2022-01-22 23:59:43 +08:00   ❤️ 1
    1. 写两套,或者自适应
    2. flex 用布局比较多
    3. 移动端用 px 转 rem 或者 vw
    sjhhjx0122
        2
    sjhhjx0122  
       2022-01-23 01:04:49 +08:00   ❤️ 1
    1.如果是博客门户网站这种一般都是给最外层容器规定一个最大宽度,然后媒体查询变一下布局,flex 布局的话不要写死宽度就好了,最简单用 tailwind 就好了
    2.用 vw 的话主要是只能移动设备看了
    rongchuan
        3
    rongchuan  
       2022-01-23 14:22:11 +08:00   ❤️ 1
    最简单的,使用原生 css 的方式是 @media,参考[链接]( https://developer.mozilla.org/zh-CN/docs/Web/CSS/@media)
    根据屏幕大小,简单写一套样式即可,移动端推荐用 rem
    jones2000
        4
    jones2000  
       2022-01-23 14:32:33 +08:00
    找产品经理出一套适配的 UI , 然后开搞。
    romancekami
        5
    romancekami  
    OP
       2022-01-23 14:35:37 +08:00
    @rongchuan 了解了一下 之前还不知道有媒体查询,确实是我的知识漏洞 非常感谢!
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1037 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 20:10 · PVG 04:10 · LAX 12:10 · JFK 15:10
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.