jquerymobile table reflow 写得很罗嗦，半天没看出关键所在，自己试着写了个例子（拖动浏览器宽度小于 500px 看效果）：

姓名	年龄	性别	计算机水平	个人网站
姓名郭爽	年龄保密	性别男	计算机水平100%	个人网站http://guoshuang.com
姓名gongrui	年龄88	性别男	计算机水平60%	个人网站
姓名pujian	年龄12	性别不详	计算机水平30%	个人网站
姓名老柴	年龄保密	性别男	计算机水平18%	个人网站慈母

html 代码：

<table class="gResponsive">
  <thead>
    <tr>
      <th>姓名</th>
      <th>年龄</th>
      <th>性别</th>
      <th>计算机水平</th>
      <th>个人网站</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><b class="l">姓名</b><span class="c">郭爽</span></td>
      <td><b class="l">年龄</b><span class="c">保密</span></td>
      <td><b class="l">性别</b><span class="c">男</span></td>
      <td><b class="l">计算机水平</b><span class="c">100%</span></td>
      <td><b class="l">个人网站</b><span class="c">http://guoshuang.com</span></td>
    </tr>        
    ... ...           
  </tbody>
</table>

CSS 代码：

table.gResponsive {border-collapse: collapse;border:solid 1px #ccc;width: 100%}
table.gResponsive td,table.gResponsive th {border:solid 1px #ccc;padding:2px 5px;}
table.gResponsive .l {display: none;}
table.gResponsive tbody tr:nth-child(odd) {background:#eee;}

@media ( max-width: 500px ) {
  table.gResponsive td,table.gResponsive th {border:none;padding:6px;}
  table.gResponsive thead {display: none;}
  table.gResponsive tr {border: solid 5px #ddd}
  table.gResponsive td {white-space: nowrap;display: block;}
    table.gResponsive .l {display: block; float:left; margin-right:6px;}
}