要实现表头和表格单元格显示不同的宽度,可以使用CSS中的table-layout: fixed
属性,并结合colgroup
和col
元素来定义不同的列宽。
下面是一个示例的代码:
姓名
年龄
城市
张三
25
北京
李四
30
上海
在上面的代码中,我们使用colgroup
和col
元素来定义了三列的宽度。colgroup
元素包含了三个col
元素,每个col
元素对应一列的宽度。通过colgroup col:nth-child(n)
选择器,我们可以分别给每列指定不同的宽度。在这个示例中,我们将第一列的宽度设置为40%,第二列和第三列的宽度都设置为30%。这样就实现了表头和表格单元格显示不同的宽度。
最后,通过table-layout: fixed
属性来固定表格的布局,使得列宽度按照我们定义的宽度进行显示。
下一篇:表头和表体宽度不对齐