第一天上班学到的

昨天是上班第一天
页面搭建时候应该注意的几个点，和以前不知道的东西

1. 每个pc端页面都要考虑到不同页面大小时的情况 响应式布局
2. 手机端页面参照设计图制作时，参考的尺寸是比例，才能适应各种不同页面，图片宽度用vw，高度他会自己适应
3. 每个页面都要加一串防止页面缩放的代码 防止出现各类问题

如这段

 <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">//pc
 <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no,viewport-fit=cover">//mobile

width 属性控制设备的宽度。假设您的网站将被带有不同屏幕分辨率的设备浏览，那么将它设置为 device-width 
可以确保它能正确呈现在不同设备上。

initial-scale=1.0 确保网页加载时，以 1:1 的比例呈现，不会有任何的缩放。

在移动设备浏览器上，通过为 viewport meta 标签添加 user-scalable=no 
可以禁用其缩放（zooming）功能。

通常情况下，maximum-scale=1.0 与 user-scalable=no 
一起使用。这样禁用缩放功能后，用户只能滚动屏幕，就能让您的网站看上去更像原生应用的感觉。
--------------------- 
作者：xiejunna 
原文：https://blog.csdn.net/xiejunna/article/details/73512057 

4. 手机端的头部一般都是fixed在顶部的
5. 跳转判定 和兼容性 也是以前没接触过的 这部分代码应该是放在头部
6. 手机端去掉a标签点击变蓝的底色 a标签中加入-webkit-tap-highlight-color:transparent;
7. 暂时就想到这么多，遇到的比较大的问题就是ps切图我是在psd中直接把小的元素拖出来保存成一个新图片，这样用着感觉会比较好，但ps有点卡，效率不高
8. 刚才又发现一个，给大背景使用min-width可以避免一些问题