0

我已阅读有关此问题的一些文章，但无法解决。大多数示例显示表头由一行组成，同时行是单行，如日历。我的表有双行标题，行以行跨度开头，所以我不能让它工作。我需要固定前两列（或仅左列）和固定标题，因此如果屏幕变窄，其余列可以向右滚动。这是表

    <table class="responsive">
    <tbody>             
    <tr>
    <th rowspan="2" scope="col">CITY</th>
    <th rowspan="2" scope="col">YP</th>
    <th colspan="3" scope="col">MORNING</th>
    <th colspan="3" scope="col">MORNING</th>
    <th colspan="3" scope="col">NIGHT</th>
    </tr>
    <tr>
    <td>Temp</td>
    <td>Sun</td>
    <td>Wind</td>
    <td>Temp</td>
    <td>Sun</td>
    <td>Wind</td>
    <td>Temp</td>
    <td>Sun</td>
    <td>Wind</td>
    </tr>
    <tr>
    <th rowspan="2" scope="col">Name of city 1</th>
    <td>I</td>
    <td>80</td>
    <td>Y</td>
    <td>N</td>
    <td>90</td>
    <td>Y</td>
    <td>N</td>
    <td>96</td>
    <td>N</td>
    <td>Y</td>
    </tr>
    <tr>
    <td>II</td>
    <td>94</td>
    <td>Y</td>
    <td>N</td>
    <td>96</td>
    <td>Y</td>
    <td>N</td>
    <td>98</td>
    <td>N</td>
    <td>Y</td>
    </tr>
    <th rowspan="2" scope="col">Name of city 2</th>
    <td>I</td>
    <td>77</td>
    <td>N</td>
    <td>N</td>
    <td>80</td>
    <td>Y</td>
    <td>Y</td>
    <td>88</td>
    <td>N</td>
    <td>Y</td>
    </tr>
    <tr>
    <td>II</td>
    <td>80</td>
    <td>Y</td>
    <td>Y</td>
    <td>82</td>
    <td>Y</td>
    <td>Y</td>
    <td>87</td>
    <td>N</td>
    <td>Y</td>
    </tr>
    </tbody>
    </table>

我尝试使用 Zurb Studio - Crafty Responsive Tables，但我的表格的复杂性与演示示例不匹配。

在此处输入图像描述

4

1 回答 1

0

经过长时间的网站研究，我认为名为RowsGroup的插件应该会有所帮助。直到现在我还没有意识到解决我自己的表格的正确程序，但这是一个不错的开始。我曾希望有人会帮助我，但似乎在某些情况下一切都取决于作者。：/

于 2016-04-09T21:17:43.057 回答