如何使用CSS或HTML粗体化特定的HTML行和列?

作者:互联网

2026-03-29

HTML教程
我想加粗 HTML表格的第一行和第一列(第0行和第0列).如何使用HTML或CSS完成?

桌子:

    . . .    
translate.com AND https://translate.google.com/ http://www.bing.com/translator/
I eat tacos Yo como tacos Comer tacos

……和CSS:

body {    font-family: "Segoe UI", "Calibri", "Candara", "Bookman Old Style", "Consolas", sans-serif;    font-size: 1.2em;    color: navy;}

……非常基本.

表格如下:http://jsfiddle.net/clayshannon/LU7qm/7/

要使用CSS加粗第一行和第一列,使用当前的HTML标记,请使用 :first-child伪类,它匹配作为其父项的第一个子元素(第一个子元素)的任何元素:

tr:first-child, td:first-child { font-weight: bold }

但是,如果这些单元格是标题单元格(对于同一列或同一行中的其他单元格),则对它们使用th元素并将第一行包装在thead元素中可能更合乎逻辑:

translate.com AND https://translate.google.com/ http://www.bing.com/translator/
I eat tacos Yo como tacos Comer tacos

默认情况下,这些元素以粗体显示(尽管您仍然可以使用CSS来明确说明).它们也将默认居中;如果您不想这样,您可以轻松地使用CSS覆盖它,例如th {text-align:left}.

在这种情况下,第一行看起来非常像标题行,所以我会把它变成一个thead.这可能是有用的,例如因为如果页面被打印并且表格被分成两页或更多页面,那么许多浏览器会在新页面的开头重复该行.至于每行的第一个单元格,如果需要,它们可能最好保持为td并且只是粗体样式.