很多朋友都很苦惱表格樣式怎麼設定。之前說過對table設定邊框和對td設定邊框。今天為大家帶來對table和td技巧性設置表格邊框,以後也會繼續更新關於表格的小技巧與設置,也請大家持續關注。
對td設定左與上邊框,這樣td與td相鄰就會只出現單一邊框樣式,這樣就會出現表格右側和下部沒有邊框,這個時候我們設定table右和下邊框解決顯示右側和下側td剩下未顯示邊框。
1、對應css程式碼:
1 2 3 4 5 6 7 | <style>
.table-c table{border-right:1px solid #F00;border-bottom:1px solid #F00}
.table-c table td{border-left:1px solid #F00;border-top:1px solid #F00}
</style>
|
登入後複製
2、對應html原始碼片段:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <div class = "table-c" >
<table width= "400" border= "0" cellspacing= "0" cellpadding= "0" >
<tr>
<td width= "105" >站名</td>
<td width= "181" >网址</td>
<td width= "112" >说明</td>
</tr>
<tr>
<td>PHP</td>
<td>www.divcss5.com</td>
<td>PHP</td>
</tr>
<tr>
<td>PHP</td>
<td>www.php.cn</td>
<td>PHP</td>
</tr>
|
登入後複製
這就是怎麼對table和td技巧性設定表格邊框,你學到了嗎?
相關閱讀:
怎麼用CSS對td設定邊框
怎麼用CSS只對錶格table的標籤設定邊框
以DIV和CSS作下拉式選單
以上是怎樣對table和td技巧性設定表格邊框的詳細內容。更多資訊請關注PHP中文網其他相關文章!