表内容在引导中如何响应？

Question

我试图设置th宽度，但它只更改桌面视图。如果我打开移动表中的页面，设置不正确。我也尝试了-xs-2来修复th，但是它不是工作的。

<div class="form-group col-lg-12 col-md-12 col-xs-12">
                <div class="col-lg-12 col-md-12 col-xs-12 col-md-offset-1">
                            <div class="row" >
                                        <div class = "table-responsive">
                                            <table class="table table-hover table-striped">
                                                <thead>
                                                    <tr class="info">
                                                        <th class="col-md-2 col-xs-2" > No</th>
                                                        <th class="col-md-4 col-xs-4">Dish Name</th>
                                                        <th class="col-md-2 col-xs-2"> Size</th>
                                                        <th class="col-md-2 col-xs-2">Prize</th>
                                                        <th class="col-md-2 col-xs-2">Order</th>
                                                    </tr>
                                                </thead>
                                <tbody>
                                    <tr title="Order Chicken Kadhai">
                                        <td >1</td>
                                        <td >Chicken Kadhai</td>
                                        <td >Full</td>
                                        <td >150/-</td>
                                        <td ><input type="button" class="btn btn-info" value="ORDER"> </td>
                                    </tr>
                                    <tr>    
                                        <td >2</td>
                                        <td >Chicken Roast</td>
                                        <td >Full</td>
                                        <td >250/-</td>
                                        <td ><input type="button" class="btn btn-info" value="ORDER"> </td>
                                    </tr>
                                    <tr>

                                        <td >3</td>
                                        <td >Chicken Tandori</td>
                                        <td >Full</td>
                                        <td >350/-</td>
                                        <td ><input type="button" class="btn btn-info" value="ORDER"> </td>
                                    </tr> 
                                </tbody>
                            </table>  
                          </div>                                            
                                    </div>
                                </div>
                            </div>

​

​

如何将th设置为响应表

Answer 1

来自评论：

列不用于表中。表-响应根据内容进行自我调整。

Answer 2

使用此代码可能会对您有所帮助。

<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>

Answer 3

编写<class=".table-responsive>"而不是class=<class="table-responsive>"