自适应手机端表格（table）样式代码

很多时候我们在网站后台更新内容的时候都会遇到插入表格，但是table有一个bug，就是不能兼容手机端浏览，所以所插入的表格一定要做成自适应的才能方便用户浏览，以下是我做网站的时候做写的代码供大家参考：

table { 
   table-layout:fixed !important; 
   width:80% !important;
   border-collapse:collapse;
   border:none;
   margin:0 auto;
}

td,th {
  width:1px;
  white-space:nowrap; /* 自适应宽度*/
  word-break:keep-all; /* 避免长单词截断，保持全部 */
  border:solid #676767 1px;
  text-align:center;
  white-space:pre-line;
  word-break:break-all !important;
  word-wrap:break-word !important;
  display:table-cell;
  vertical-align:middle !important;
  white-space: normal !important;
  height:auto;
  vertical-align:text-top;
  padding:2px 2px 0 2px;
  display: table-cell;
}

colspan:左右合并单元格的个数；

用法：colspan="3″ 横向合并三个单元格'。

rowspan:上下合并单元格的个数；

用法：rowspan="3″ 垂直合并三个单元格。

本文属原创，转载请注明原文：http://www.zhimatong.com/jiaocheng/444.html

为保证教程的实用性及扩大知识面覆盖，如果您有相似问题而未解决，可联系在线客服免费技术支持。