Question

我有一个这样的桌子

但是我希望选项栏变小

代码（我使用引导程序4）：

<table class="table table-bordered table-hover">
                        <thead class="table-primary">
                            <tr class="text-center">
                                <th scope="col">#</th>
                                <th scope="col">Nom</th>
                                <th scope="col" colspan="2">Options</th>
                            </tr>
                            </thead>
                        <tbody class="table-light">
                        <tr class="text-center">    
                                <th scope="row"><?php echo $donnees[0]; ?></th>
                                <td><?php echo $donnees[1]; ?></td>
                                <td><a href="#"><img src="res\images\edit-icon.svg" height="30x" title="modifier"></a></td>
                                <td><a href="#"><img src="res\images\delete-icon.svg" height="30x" title="supprimer"></a></td>
                            </tr>
                            </tbody>
                    </table>

Answer 1

一个非常简单的解决方案是将选项标头的width设置为1％。宽度将为1％，或者如果内容较大，则为内容的大小。像这样：

<table class="table table-bordered table-hover">
                    <thead class="table-primary">
                        <tr class="text-center">
                            <th scope="col">#</th>
                            <th scope="col">Nom</th>
                            <th scope="col" colspan="2" width="1%">Options</th>
                        </tr>
                        </thead>
                    <tbody class="table-light">
                    <tr class="text-center">    
                            <th scope="row"><?php echo $donnees[0]; ?></th>
                            <td><?php echo $donnees[1]; ?></td>
                            <td><a href="#"><img src="res\images\edit-icon.svg" height="30x" title="modifier"></a></td>
                            <td><a href="#"><img src="res\images\delete-icon.svg" height="30x" title="supprimer"></a></td>
                        </tr>
                        </tbody>
                </table>

我如何才能最小化html表中的列宽？

1 个答案: