Question

我的任务是在所有标题上切换TH元素的TD元素而不改变外观。目前TD上唯一的造型是：

td.detailColHeader {
    background-color:#d5d5d5;
    color:#000;
    font-weight:bold;
}

当我将它应用于th时，它看起来并不相同。任何人都知道需要添加什么来使TH看起来像TD？

Answer 1

TH和TD元素用于表格单元格。 TH用于桌子标题单元，而TD用于表数据单元。这种区别为用户代理提供了一种明确地呈现这些单元的方法例如，对标题单元格使用更大或更重的字体。它是渲染到语音时也需要。可以使用CLASS属性进一步区分细胞，例如进入头部和子头部。这可以与样式表一起使用来控制单元格边框风格，填充颜色等。

实际上，您唯一需要做的改变是：

td {
    font-weight: bold;
}

＆＃13;

td {
    font-weight: bold;
}

＆＃13;

<table>
    <tr>
        <th>th</th>
    </tr>
    <tr>
        <td>td</td>
    </tr>
</table>

＆＃13;

在@Alohci之后你还可以添加：

th {
    text-align: left;
}

当表具有固定宽度时。

＆＃13;

td {
    font-weight: bold;  
}

table{
    width: 200px;
}

th{
    text-align: left;
}

＆＃13;

<table>
    <tr>
        <th>th</th>
    </tr>
    <tr>
        <td>td</td>
    </tr>
</table>

＆＃13;

如何将th元素设计为看起来像td

1 个答案: