为了账号安全,请及时绑定邮箱和手机立即绑定

表格怎么做响应式

表格怎么做响应式

前端3549 2016-07-11 12:49:05
       公司要求我在原来的网页上添加响应式,其中有一副大图是用表格把很多小图拼起来的,用了响应式的.table-responsive,但是不管用,会出现表格的分割线,添加栅格系统也不好使,表格和图片还设了具体的宽高 Orz  试了一早上实在没想出好办法,哪位大神能帮忙想一下。
查看完整描述

2 回答

?
幕布斯7574896

TA贡献38条经验 获得超3个赞

这个你逆向分析boostrap.css的源码就会发现其设置了为th设置了border-bottom,为td设置了border-top。 

自定义样式将border的宽度设为0px即可。      

.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th ,.table>thead>tr>th{
   border-bottom:0px;
    border-top: 0px solid #ddd
}


查看完整回答
反对 回复 2018-05-04
?
hulukid

TA贡献190条经验 获得超40个赞


表格宽度不要写成固定的数值。用100%试试

查看完整回答
反对 回复 2016-07-14
  • 前端3549
    前端3549
    试过了,最后图片确实可以进行响应式布局,但缩小到xs的时候,图片全都分开了,露出了背景色...... Orz
  • hulukid
    hulukid
    图片也是同样不要写死,用max-width, max-height
  • 2 回答
  • 0 关注
  • 1459 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信