在HTML中,表格是一種很常見的元素,它可以將數據按照一定的格式呈現出來。如果我們需要為表格中的某些單元格設置字體樣式,我們可以使用CSS來實現。本文將介紹如何在表格的行(tr)中設置字體樣式。
首先,我們需要在表格的頭部(th)或者其他單元格(td)中引入CSS樣式:
<table> <tr> <th>姓名</th> <th>年齡</th> </tr> <tr> <td class="name">小明</td> <td class="age">20</td> </tr> </table> <style> .name { font-family: Arial, sans-serif; font-size: 16px; } .age { font-family: "Times New Roman", serif; font-size: 14px; } </style>
上面的代碼定義了一個表格,其中第一行為表頭,第二行有兩列分別顯示姓名和年齡。我們分別為這兩個單元格添加了class屬性,方便CSS選擇器中使用。
接下來,在<style>標簽中,我們可以使用字體樣式屬性設置單元格中的文字樣式。常見的字體屬性包括:
- font-family:字體名稱或字體族名稱(例如 Arial, sans-serif)
- font-size:字體大小(單位可以是 px、em、rem 等)
- font-style:字體風格,包括 normal、italic、oblique 等
- font-weight:字體粗細,包括 normal、bold、bolder、lighter 等
完成上述代碼后,我們可以在瀏覽器中查看并驗證設置是否生效。通過這種方式,我們可以輕松地在表格的行(tr)中設置字體樣式,讓頁面更加美觀。
上一篇css在ul右側添加元素
下一篇css圓邊角