手机预览 & 电脑调试手机

图片超过 300KB 就需要压缩(否则下载很慢) 搜索 jpg/png在线压缩

怎么兼容手机？
第1步 补齐meta:vp (<meta name="viewport">的缩写)

//宽度跟设备宽度一样，默认缩放比例是一倍，最小/最大的是1倍，用户不准缩放
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

第2步 img max-width

img{ max-width:100%;}   

真机运行的话也要加meta:vp

手机预览页面

一.用wifi调试手机

1.通过hs -c-1把给出的IP全都试一遍

2.把编辑好的地址发给手机，手机可以直接打开页面

  例如 http://127.0.0.1:8080/src/index.html

二.映射端口(不在同一Wi-Fi下也能调试手机)

过程：

打开开发者工具-> More tools-> Remote devices(远程设备)->点击按钮Port forwarding映射端口(添加端口)

补充：如果找不到【远程设备】࿰