更好的理解position:relative的应用

先记录一下问题。在使用iview的表格进行左右两列固定时,iview会自己在传过去的高度上加上一个滚动条的高度,如果有出现横向滚动条还好,但是如果没有出现横向滚动条就会这样

如果项目中公用样式文件还很巧的把iview设置的表格边框去掉了,而你不知道,那简直就是灾难

我就正好碰上了这种情况,并且一发现这个情况就被同事定为我的bug,然后我就苦逼的一直在改bug,结果浪费了不少时间。后来是在给iview传过去的高度上减去了滚动条的高度,但是依然会有问题。所以最后决定自己写表格好了,事实证明自己写也不会花很长时间。。。

自己写碰到需要手动改变单元格的left值或者top值来达到滚动的效果,就需要td设为position:relative.让单元格相对自身原来的位置来移动滚动条滚动的距离。

 借鉴iview的思路,用四个表格实现左边列和表格头部的固定,需要注意的是左边固定列的外框高度需要减去滚动条的高度,否则会遮挡住滚动条

 

解决这个问题的过程表明:

第一:有问题可借鉴官方实例或者其他的相同或者相似的案例

第二:要学会看源码

第三:要相信自己啊,方向错了,只会浪费更多时间。 

posted @ 2017-10-10 17:29  coconutGirl  阅读(338)  评论(0编辑  收藏  举报