页面分辨率调试总结

自从来了新公司，大部分的时间都在开发前台业务

后台使用springCloud全家桶后

后台基本上都是写model类了

最近在适配前台的分辨率问题

真是各种深坑

1、使用antV可视化组件，图表的设置不能在less文件里面设置，必须作为参数传递进去，

     开发当初全部是写死的，所以全部提取成配置参数，1920、1280、1366各一份
2、如果出现文字过长超出当前面板位置，则设置文字长度，超出部分以省略符代替，同时提供title属性，当鼠标放到面板时提示全部内容

省略号设置：

overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;

3、表格列宽设置使用百分比，最后一行不设置宽度

4、图表位置调试

1920分辨率的

1366和1280分辨率的样式

5、react样式设置是通过className，使用class会有警告提示

class样式有在className引入设置也可以直接在css文件直接设置，不需要在代码中引用

6、px、em、vh的区别（参考：https://blog.youkuaiyun.com/weixin_42192534/article/details/80289782）

px、em字体设置

px：px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。

em：根据父节点设置当前字体大小，如果父节点没有设置则根据浏览器设置（浏览器默认大小为16px）

vh：相对高度单位，表示相对视口高度（Viewport Height），1vh = 1% * 视口高度。

视口比例长度定义了相对于视口的长度大小，这是文档的可见部分。 当视口的大小被修改（通过更改桌面计算机窗口大小或旋转手机或平板设备的方向）时，只有基于Gecko的浏览器才动态更新视口值。