自适应手机端表格（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;
}

注：

由于大家都使用excel做表格，所以这里推荐一个很好用的工具可以轻松完成将已有的Excel、Word等表格内容一键转为html代码的网站，将它们复制到源码(html)模式下，就可以完成表格的转换了。。。

http://www.huanglucheng.com/table-clear/table.html 点击打开这个地址就可以使用这个工具了，是不是很方便，哈哈！

另外大家在html插入表格的时候难免会遇到合并单元格的困扰，这里也把相对应的代码贴出来给大家参考啦：

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

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

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

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