改变表中thead的高度

时间:2011-10-22 13:51:43

标签: jquery html

有没有办法更改theadtable的高度?我试过了

$('thead').height('2px');

但无济于事,高度不会改变。

我做错了什么?感谢

2 个答案:

答案 0 :(得分:7)

这可能取决于浏览器。某些浏览器可能会将thead元素视为一个容器而没有任何高度。尝试使用Javascript或CSS在TH元素本身上设置高度。请注意,要获得小于线条高度的内容,您还必须设置线条高度,因为表格元素将调整大小以适合其内容。

$('thead th').css({ height: '2px', line-height: '2px' });

 <style>
    .header th {
       height: 2px;
       line-height: 2px;
    }
 <style>

 <table>
    <thead class="header">
        <th>Foo</th>
        ...
    </thead>
    ...
 </table>

正如@Marco在他的例子中所说,你也可以强制将THEAD视为块级元素并直接设置它的高度。根据您要完成的内容以及THEAD中包含的内容,这可能会也可能不会达到您想要的效果。有关您正在尝试实现的目标的更多信息可以帮助我们找到适合您的解决方案。

答案 1 :(得分:3)

似乎工作正常。

http://jsfiddle.net/KWbxL/1/

它显示为一张桌子,其高度低于其内容。 因此,如果你需要2px的高度,你需要显示:block并有溢出:隐藏内容(隐藏在2px中)。

为什么不使用CSS,而不是使用JS来做你的样式:)