好的。首先，jQuery Mobile是一个用于创建响应式Web应用程序和网站的JavaScript库。其中的Column-Toggle Table则是用于在小屏幕设备上展示表格时进行行列折叠的功能。
在使用Column-Toggle Table功能时，我们需要使用以下相关的CSS类：
ui-responsive：表示表格需要根据屏幕大小自适应宽度。ui-table-reflow：表示当前表格在小屏幕设备上需要进行行列折叠，用户需要滑动表格来查看所有内容。ui-table-reflow-mode: 表示行列折叠的模式。可以设置为columntoggle或swipe来分别使用列切换或滑动折叠效果。
而对于Column-Toggle Table，我们还需要使用下面的CSS类：
ui-table-columntoggle：表示表格需要使用列切换功能。ui-mobile-ntf-inline：可选，显示列切换的通知消息。
接下来就是使用这些CSS类来创建Column-Toggle Table的步骤了。
步骤1：在HTML中添加表格结构
首先，我们需要在HTML中添加一个标准的表格结构。这个结构可以按照普通表格的格式来编写，如下所示：
<table data-role="table" data-mode="columntoggle" class="ui-responsive ui-table ui-table-reflow ui-table-columntoggle">
<thead>
<tr>
<th>编号</th>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>张三</td>
<td>20</td>
<td>男</td>
</tr>
<tr>
<td>2</td>
<td>李四</td>
<td>22</td>
<td>女</td>
</tr>
<tr>
<td>3</td>
<td>王五</td>
<td>24</td>
<td>男</td>
</tr>
</tbody>
</table>
上面的代码中，我们使用data-role="table"来告诉jQuery Mobile这是一个表格元素，而data-mode="columntoggle"则表示我们要使用Column-Toggle Table的列切换功能。表格中各个元素也按照正常的表格方式编写。注意，我们要在表格元素的class属性中添加所有必要的CSS类，以启用Column-Toggle Table的功能，包括ui-responsive、ui-table-reflow和ui-table-columntoggle。
步骤2：添加列切换按钮和通知消息
接下来，我们还需要手动添加列切换按钮和通知消息。这可以通过为表格添加一个额外的行来完成，如下所示：
<table data-role="table" data-mode="columntoggle" class="ui-responsive ui-table ui-table-reflow ui-table-columntoggle">
<thead>
<tr>
<th>编号</th>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>张三</td>
<td>20</td>
<td>男</td>
</tr>
<tr>
<td>2</td>
<td>李四</td>
<td>22</td>
<td>女</td>
</tr>
<tr>
<td>3</td>
<td>王五</td>
<td>24</td>
<td>男</td>
</tr>
</tbody>
<tfoot>
<tr>
<th><button data-role="columntoggle" data-iconpos="notext" data-icon="bars" class="ui-btn ui-corner-all ui-btn-icon-notext">列切换</button></th>
<th colspan="3" class="ui-mobile-ntf-inline"></th>
</tr>
</tfoot>
</table>
上面的代码中，我们首先在表格的tfoot元素中添加了一个行元素。这个行元素包含两个单元格：一个单元格中包含了一个按钮，点击这个按钮可切换表格中列的显示和隐藏；而另一个单元格则用于显示通知消息。通知消息的样式由ui-mobile-ntf-inline指定，这会在切换列时自动出现。
按钮的样式由ui-btn、ui-corner-all和ui-btn-icon-notext指定，这些都是jQuery Mobile中的预定义样式类。data-role="columntoggle"表示这是一个列切换的按钮，而data-icon和data-iconpos则分别指定了按钮图标和图标位置。
好了，上面的两步就是使用Column-Toggle Table的基本步骤了。下面简单介绍一下Column-Toggle Table的两个示例。
示例1：使用滑动折叠效果
在上面的步骤中，我们展示的是使用列切换效果的Column-Toggle Table，现在我们来看一下使用滑动折叠效果的Column-Toggle Table。只需要将之前表格元素中的data-mode属性修改即可：
<table data-role="table" data-mode="reflow" class="ui-responsive ui-table ui-table-reflow">
<thead>
<tr>
<th>编号</th>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>张三</td>
<td>20</td>
<td>男</td>
</tr>
<tr>
<td>2</td>
<td>李四</td>
<td>22</td>
<td>女</td>
</tr>
<tr>
<td>3</td>
<td>王五</td>
<td>24</td>
<td>男</td>
</tr>
</tbody>
<tfoot>
<tr>
<th><button data-role="columntoggle" data-iconpos="notext" data-icon="bars" class="ui-btn ui-corner-all ui-btn-icon-notext">列切换</button></th>
<th colspan="3" class="ui-mobile-ntf-inline"></th>
</tr>
</tfoot>
</table>
只需要将data-mode属性修改为reflow，同时去掉ui-table-columntoggle类即可。示例中的表格将自动使用滑动折叠效果。
示例2：使用自定义通知消息
默认情况下，Column-Toggle Table使用的是自带的通知消息。我们也可以通过以下代码来自定义通知消息：
<table data-role="table" data-mode="columntoggle" class="ui-responsive ui-table ui-table-reflow ui-table-columntoggle">
<thead>
<tr>
<th>编号</th>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>张三</td>
<td>20</td>
<td>男</td>
</tr>
<tr>
<td>2</td>
<td>李四</td>
<td>22</td>
<td>女</td>
</tr>
<tr>
<td>3</td>
<td>王五</td>
<td>24</td>
<td>男</td>
</tr>
</tbody>
<tfoot>
<tr>
<th><button data-role="columntoggle" data-iconpos="notext" data-icon="bars" class="ui-btn ui-corner-all ui-btn-icon-notext">Column Toggle</button></th>
<th colspan="4" class="my-custom-ntf">自定义通知消息</th>
</tr>
</tfoot>
</table>
在上面的代码中，我们在tfoot中第二个单元格中添加了一个自定义的通知消息。通知消息的样式由一个新的CSS类my-custom-ntf指定。
综上所述，这就是使用Column-Toggle Table的攻略及两个示例。