合并行使用和合并列分別使用什么屬性

在html頁面中, table表格利用仍是比力頻仍的, 可是, 現實的列表中, 行列凡是不會那么法則的展示, 凡是需要歸并行或者歸并列

需要這些哦
visual studio code
方式/
1【合并行使用和合并列分別使用什么屬性】歸并行利用rowspan, 歸并列利用colspan來進行table行列歸并

合并行使用和合并列分別使用什么屬性



2利用visual studio code編纂東西, 新建一個html頁面, 添加html5的頁面根基布局
4前端頁面開辟東西 - VSCode的下載與安裝

合并行使用和合并列分別使用什么屬性



3在body規模中添加一個table, 此處僅做演示, 直接在table中添加tr, 未添加thead、tbody 。 并為表格添加css邊框樣式

合并行使用和合并列分別使用什么屬性



4利用瀏覽器打開這個測試頁面, 運行可以看到默認的table樣子, 此時還沒有歸并行或者列

合并行使用和合并列分別使用什么屬性



5利用rowspan進行單位格的行歸并, 此處將第一行第一列設置rowspan=2, 那么, 第一行第一列半斤八兩于就占有第一、二行的第一列, 即占用了兩個單位格位置, 所以, 下一行就需要注釋失落一個單位格

合并行使用和合并列分別使用什么屬性



6在瀏覽器中打開這個測試頁面, 就可以看到第一列進行了行歸并

合并行使用和合并列分別使用什么屬性



7利用colspan進行單位格的列歸并, 此處將第一行的第三、四列歸并, 在第三列中利用colspan=2, 同時注釋失落第四列即可

合并行使用和合并列分別使用什么屬性



8在瀏覽器中打開這個測試頁面, 就可以看到第一行的第三四列歸并了

合并行使用和合并列分別使用什么屬性




以上內容就是合并行使用和合并列分別使用什么屬性的內容啦, 希望對你有所幫助哦!

    猜你喜歡