如何在Jquery Mobile中使现有表具有响应性?

如何在Jquery Mobile中使现有表具有响应性?,jquery,html,css,jquery-mobile,responsive-design,Jquery,Html,Css,Jquery Mobile,Responsive Design,我有下表 <table style="height: 803px;" width="591"> <tbody> <tr> <td> <p><strong>Model#</strong></p> </td> <

我有下表

<table style="height: 803px;" width="591">
        <tbody>
            <tr>
                <td>
                    <p><strong>Model#</strong></p>
                </td>

                <td>
                    <p><strong>Item Code</strong></p>
                </td>

                <td>
                    <p><strong>Description</strong></p>
                </td>

                <td>
                    <p><strong>Old Retail</strong></p>
                </td>

                <td>
                    <p><strong>Promotion Retail</strong></p>
                </td>

                <td>
                    <p><strong>Remarks</strong></p>
                </td>
            </tr>

            <tr>
                <td>
                    <p>WM608</p>
                </td>

                <td>
                    <p>11619082</p>
                </td>

                <td>
                    <p>Campomatic front load washer &nbsp;6 KG, 800RPM ,8
                    programs,electronic control,</p>
                </td>

                <td>
                    <p>799</p>
                </td>

                <td>
                    <p>799</p>
                </td>

                <td>
                    <p>FREE CAMPOMATIC vacuum cleaner model#RC1808 1800W WORTH
                    199 DHS + FREE Campomatic hair dryer HP20 WORTH 99 DHS</p>
                </td>
            </tr>

            <tr>
                <td>
                    <p>IWE-81281ECOUK</p>
                </td>

                <td>
                    <p>11675623</p>
                </td>

                <td>
                    <p>Indesit front load washer ,8kg,1200 rpm,digital display
                    ,Energy Efficiency Class: A+, white color</p>
                </td>

                <td>
                    <p>1899</p>
                </td>

                <td>
                    <p>1599</p>
                </td>

                <td>
                    <p>300 DHS GV+free persil 3ltr detergent 2 pcs worth 78
                    dhs</p>
                </td>
            </tr>

        </tbody>
    </table>

型号#

项目代码

说明

旧零售店

促销零售

备注

WM608

11619082

Campomatic前负载清洗器6千克,800转/分,8 程序,电子控制,

799

799

免费CAMPOMATIC真空吸尘器型号#RC1808 1800W 199 DHS+免费Campomatic吹风机HP20,价值99 DHS

IWE-81281库克

11675623

独立式前负荷清洗器,8kg,1200 rpm,数字显示 ,能效等级:A+,白色

1899年

1599

300 DHS GV+免费persil 3ltr清洁剂2件价值78 国土安全部


我想让它反应灵敏。我正在使用Jquery Mobile

只需将
数据角色='table'
添加到您的table元素中。默认的表类型是回流,因此当它到达较小的空间量时,表将堆叠

有关更多详细信息,请参阅以下链接


编辑:将链接更新到最新版本

响应表格只是一个100%宽度的表格

您可以使用以下CSS设置表格:
.table{width:100%;}

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Responsive table</title>
<style>
.table {
  width: 100%;
  background: blue;
  color: white;
}
</style>
</head>
<body>
  <table class="table">
    <thead>
      <tr>
        <th colspan="2">Table head</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>Cell 1</td>
        <td>Cell 2</td>
      </tr>
    </tbody>
  </table>
</body>
</html>

响应表
.桌子{
宽度:100%;
背景:蓝色;
颜色:白色;
}
桌头
第1单元
第2单元

快速回答,使用百分比宽度。@RoryMcCrossan,谢谢。哪里?谢谢。也看这个,,