常用的html標(biāo)簽匯總、以及操作過(guò)程中的一些bug問(wèn)題解決方法,以下龍騰飛網(wǎng)絡(luò)科技-小吳在建站實(shí)操中筆記記錄,一路走來(lái),一步步學(xué)習(xí)、總結(jié)、整理的一些資料,不用死記硬背,保存使用非常方便,實(shí)操過(guò)程中遇到了就查詢(xún)搜索一下,實(shí)踐出真章,做多了自然就熟悉了:
【定義和用法】
tr標(biāo)簽定義 HTML 表格中的行。
tr元素包含一個(gè)或多個(gè) th或 td元素。
【實(shí)例】
例子 1
一個(gè)簡(jiǎn)單的三行 HTML 表格;一個(gè)標(biāo)題行和兩個(gè)數(shù)據(jù)行:
<table> <tr> <th>月份</th> <th>儲(chǔ)蓄</th> </tr> <tr> <td>一月</td> <td>¥3400</td> </tr> <tr> <td>二月</td> <td>¥4500</td> </tr></table>
例子 2
如何對(duì)齊 tr中的內(nèi)容(使用 CSS):
<table style="width:100%"> <tr> <th>月份</th> <th>儲(chǔ)蓄</th> </tr> <tr style="text-align:right"> <td>一月</td> <td>¥3400</td> </tr></table>
例子 3
如何將背景顏色添加到表格行(使用 CSS):
<table> <tr style="background-color:#FF0000"> <th>月份</th> <th>儲(chǔ)蓄</th> </tr> <tr> <td>一月</td> <td>¥3400</td> </tr> </table>
例子 4
如何垂直對(duì)齊 tr中的內(nèi)容(使用 CSS):
<table style="height:200px"> <tr style="vertical-align:top"> <th>月份</th> <th>儲(chǔ)蓄</th> </tr> <tr style="vertical-align:bottom"> <td>一月</td> <td>¥3400</td> </tr></table>
例子 5
如何創(chuàng)建表格標(biāo)題:
<table> <tr> <th>姓名</th> <th>電郵</th> <th>電話</th> </tr> <tr> <td>longtengfei</td> <td>longtengfei@www.alhakaek.com</td> <td>138-1234-5678</td> </tr></table>
例子 6
如何創(chuàng)建帶有標(biāo)題的表格:
<table> <caption>月份ly savings</caption> <tr> <th>月份</th> <th>儲(chǔ)蓄</th> </tr> <tr> <td>一月</td> <td>¥3400</td> </tr> <tr> <td>二月</td> <td>¥4500</td> </tr></table>
例子 7
如何定義跨越多行或多列的表格單元格:
<table> <tr> <th>姓名</th> <th>電郵</th> <th colspan="2">電話</th> </tr> <tr> <td>longtengfei</td> <td>longtengfei@www.alhakaek.com</td> <td>138-1234-5678</td> <td>186-2345-6789</td> </tr></table>
【默認(rèn)的 CSS 設(shè)置】
大多數(shù)瀏覽器將使用以下默認(rèn)值顯示 tr元素:
tr { display: table-row; vertical-align: inherit; border-color: inherit;}