0

我想首先使用 JQuery 移动表创建一个 5 列的表。这是我的代码：

<table>
  <thead>
    <tr>
      <th scope="col">検査項目</th>
      <th scope="col">半日ドック&lt;/th>
      <th scope="col">1泊ドック</th>
      <th scope="col">2泊ドック</th>
      <th scope="col">検診内容</th>
    </tr> 
  </thead>

  <tbody> 
    <tr>
      <th>診察</th>
      <td>○&lt;/td>
      <td>○&lt;/td>
      <td>○&lt;/td>
      <td>問診・聴打診</td>
    </tr>
  </tbody>
</table>

我的CSS是：

table {
  width:100%;
  font-size:9px;
  background:#FAFBF5;
}

th {
  text-align:center;
  background:#C2E195;
  font-size:9px;
  border:1px solid;
}

td {
  text-align:center;
  background:#FFFFFF;
  border:1px solid;
}

一个问题是，它在索尼爱立信和其他公司中运行良好，但在 iPhone 上却无法运行。然后我尝试了以下代码：

<div class="ui-grid-d">
  <div class="ui-block-a">
    <div class="ui-bar-d" style="background:#C2E195; font-size:8px; color:#000000; text-align:center; height:50px">検査項目</div>
  </div>
  <div class="ui-block-b">
    <div class="ui-bar-d" style="background:#ffffff; font-size:8px; color:#000000; text-align:center; height:50px">半日ドック&lt;/div>
  </div>
  <div class="ui-block-c">
    <div class="ui-bar-d" style="background:#ffffff; font-size:8px; color:#000000; text-align:center; height:50px">1泊ドック</div>
  </div>
  <div class="ui-block-d">
    <div class="ui-bar-d" style="background:#ffffff; font-size:8px; color:#000000; text-align:center; height:50px">2泊ドック</div>
  </div>
  <div class="ui-block-e">
    <div class="ui-bar-d" style="background:#ffffff; font-size:8px; color:#000000; text-align:center; height:50px">検診内容</div>
  </div>

问题是，它在 iPhone 上运行良好，但在索尼爱立信上却不行。

我怎样才能在这两个平台上进行这项工作？

4

1 回答 1

0

JQM 还没有表格小部件。同时，您可以使用我的小部件表格视图（示例/ Github）。

这为您提供了具有一些响应功能的基本 JQM 表布局。除了 iOS、Android 2.3 和桌面，还没有真正测试过它。效果很好，所以试试看。

于 2012-10-07T09:59:58.900 回答