CSS 如何让Table的里面TD全有边框而Table的右左边框没有

最新推荐文章于 2023-09-19 08:17:02 发布

转载最新推荐文章于 2023-09-19 08:17:02 发布 · 1.1w 阅读

文章标签：

#css

CSS 专栏收录该内容

7 篇文章

订阅专栏

本文详细介绍了如何使用CSS来定义和应用样式，并通过实例展示了如何在表格中实现特定的布局效果。同时讨论了GridView在类似场景中的作用，以及在代码中引入冗余代码的情况。

比如这样一个CSS

.td3{
font-size: 14px;
color: #FFFFFF;
background-color: #000000;
BORDER-RIGHT: #f6f6f6 1px solid; //显示右边框为1px，如果不想显示就为0px
BORDER-TOP: #f9f9f9 0px solid; //显示上边框为1px，如果不想显示就为0px
BORDER-LEFT: #f9f9f9 0px solid;//显示左边框为1px，如果不想显示就为0px
BORDER-BOTTOM: #f5f5f5 0px solid;//显下右边框为1px，如果不想显示就为0px
}

在你调用显示这个样式的TD里调用class="td3"
就可以了
比如：

  <table width="400" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td class="td3"></td><td class="td3"></td class="td3"><td></td class="td3"><td></td></tr>
</table>

一样可以的，你变通下哈
比如你定义一个

.table1{}
.table1 td{ 
font-size:   14px; 
color:   #FFFFFF; 
background-color:   #000000; 
BORDER-RIGHT:   #f6f6f6   1px   solid;   //显示右边框为1px，如果不想显示就为0px 
BORDER-TOP:   #f9f9f9   0px   solid;   //显示上边框为1px，如果不想显示就为0px 
BORDER-LEFT:   #f9f9f9   0px   solid;//显示左边框为1px，如果不想显示就为0px 
BORDER-BOTTOM:   #f5f5f5   0px   solid;//显下右边框为1px，如果不想显示就为0px 
} 


<table   width="400"   border="0"   cellspacing="0"   cellpadding="0"   align="center" class="table1"> 
<tr> 
<td> </td> <td   class="td3"> </td   class="td3"> <td> </td   class="td3"> <td> </td> </tr> 
</table>

大致就像这么定义！
为什么要用GridView
这个做的好像冗余代码不少啊