您好,登錄后才能下訂單哦!
本篇內容介紹了“HTML表格怎么設置邊框樣式”的有關知識,在實際案例的操作過程中,不少人都會遇到這樣的困境,接下來就讓小編帶領大家學習一下如何處理這些情況吧!希望大家仔細閱讀,能夠學有所成!
對于邊框的設置我們可以通過border屬性來實現,比如給表格一個1px邊框我們可以這樣設置:
1 | <table border="1px solid #ccc"> |
效果圖:
從上圖我們可以發現這樣設置只有表格的外邊框才有,里面的單元格都無邊框,所以我們也要給內部的單元格設置邊框
1 2 3 | table,table tr th, table tr td { border:1px solid #ccc; } |
效果圖:
我們可以通過設置cellspacing(單元格間距), cellpadding(單元格邊距)以及border-collapse: collapse (邊框合并)使表格的邊框合并為一個單一的邊框,這樣使得表格更加美觀該屬性設置表格的邊框是否被合并為一個單一的邊框,還是象在標準的 HTML 中那樣分開顯示使表格更加美化
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | <style> table,table tr th, table tr td { border:1px solid #ccc; } table{ width: 400px; border-collapse: collapse; } </style> <table cellpadding="0";cellspacing="0"> <tr> <td>內容</td> <td>內容</td> <td>內容</td> </tr> <tr> <td>內容</td> <td>內容</td> <td>內容</td> </tr> <tr> <td>內容</td> <td>內容</td> <td>內容</td> </tr> <tr> <td>內容</td> <td>內容</td> <td>內容</td> </tr> </table> |
效果圖:
同樣通過設置border屬性還可以更改表格邊框的顏色
“HTML表格怎么設置邊框樣式”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識可以關注億速云網站,小編將為大家輸出更多高質量的實用文章!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。