小编Fer*_*uer的帖子

Bootstrap响应表 - >使用列更改行

我在使用Bootstrap为学校创建时间表时遇到问题.时间表应对移动设备和平板电脑做出响应.

大屏幕的视图效果很好,但是当它切换到移动视图时,它会用列更改行.

Tabletview:http://imgur.com/U3ger2a,6ThcH1l 在此输入图像描述

Mobileview:http://imgur.com/U3ger2a,6ThcH1l#1 在此输入图像描述

主要的html文件:

@media only screen and (max-width: 800px) {
/* Force table to not be like tables anymore */
#no-more-tables table,
#no-more-tables thead,
#no-more-tables tbody,
#no-more-tables th,
#no-more-tables td,
#no-more-tables tr {
display: block;
}
 
/* Hide table headers (but not display: none;, for accessibility) */
#no-more-tables thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
 
#no-more-tables tr { border: 1px solid #ccc; }
  
#no-more-tables td {
/* Behave like a …

Run Code Online (Sandbox Code Playgroud)

html5 html-table css3 twitter-bootstrap

Fer*_*uer

2017 02-01

18
推荐指数

1
解决办法

6万
查看次数