国标GB28181流媒体平台EasyGBS适配手机界面显示错位问题排查

一般我们在研发流媒体平台的时候,会做个手机界面的适配,保证在手机上也可以对平台进行浏览。在适配手机的过程中,由于操作系统不同,我们总会进行些修改,通常都需要进行多次的适配才能适配成功。

本文我们就来讲一下EasyGBS适配手机,或者缩小屏幕的时候,界面表格出现高度不对的情况:

775.png

问题分析

最后一列为fixed属性时,高度会出现未占满父元素的整个高度,因此会出现一条灰线,导致视觉上适配出问题。

解决方法

在标签上加一个class="table-fixed"类名并在css中增加如下样式:

776.png

注意:vue组件中,在style设置为scoped的时候,里面再写样式对子组件是不生效的,如果想让某些样式对所有子组件都生效,可以使用 /deep/ 深度选择器。

调整之后,适配正常的画面如下图所示:

997.png

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值