在CSS中,可以使用display: inline-block;
屬性將兩個(gè)td
元素設(shè)置為橫向排列,以下是一個(gè)示例:
<table> <tr> <td style="display: inline-block;">***個(gè)td元素</td> <td style="display: inline-block;">第二個(gè)td元素</td> </tr> </table>
在這個(gè)示例中,兩個(gè)td
元素被設(shè)置為display: inline-block;
,這意味著它們將像行內(nèi)元素一樣排列,但會(huì)保留塊級(jí)元素的特性,如寬度和高度。
如果你想讓這兩個(gè)td
元素在視覺(jué)上更加接近,可以使用margin
屬性來(lái)減少它們之間的間距:
<table> <tr> <td style="display: inline-block; margin: 0 5px;">***個(gè)td元素</td> <td style="display: inline-block; margin: 0 5px;">第二個(gè)td元素</td> </tr> </table>
在這個(gè)示例中,每個(gè)td
元素的左右兩側(cè)都設(shè)置了5像素的間距,你可以根據(jù)需要調(diào)整這個(gè)值。
如果你希望這兩個(gè)td
元素在垂直方向上更加接近,可以使用vertical-align
屬性:
<table> <tr> <td style="display: inline-block; vertical-align: top; margin: 0 5px;">***個(gè)td元素</td> <td style="display: inline-block; vertical-align: top; margin: 0 5px;">第二個(gè)td元素</td> </tr> </table>
在這個(gè)示例中,每個(gè)td
元素的垂直對(duì)齊方式都設(shè)置為“top”,這意味著它們將頂部對(duì)齊,從而在視覺(jué)上更加接近。