1

我有这个简单的 HTML 表格。

<table align="center" border="1" cellpadding="0" cellspacing="0" style="width:1000px">
    <thead>
        <tr>
            <th scope="row">BB<br />
            BB<br />
            BB</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

<p>&nbsp;</p>

但我希望 AA 单元格在顶部垂直（现在它的中心垂直），并且我希望表格上方的空间并将表格左侧为 0。

在html中渲染简单的代码我会明白我的意思。

现在我想链接一个简单的 CSS 来制作这个功能，但是我该怎么做呢？

更新，CSS中的解决方案是：

th{
vertical-align:top;
}
body
{
    margin: 0;
    padding: 0;
}
4

3 回答 3

2

尝试这个 

th{
vertical-align:top;
}

或仅适用于 AA

th[scope="col"]{
vertical-align:top;
}
于 2013-08-27T12:31:54.917 回答
1

您只能定位包含aa使用以下 CSS 的单元格：

th[scope="col"] {
    vertical-align: top;
}

这是一个jsFiddle 演示

于 2013-08-27T12:33:43.007 回答
0

尝试这个。

<table align="center" border="1" cellpadding="0" cellspacing="0" style="width:1000px">
    <thead>
        <tr style="vertical-align: top;">
            <th scope="row">BB<br />
            BB<br />
            BB</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
            <th scope="col">AA</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

<p>&nbsp;</p>
于 2013-08-27T12:39:09.113 回答