HTML中两个表格使用不同的CSS
比如我做两个表格,第一个表格使用定义好样式,而第二个我只想做个普通的表格,没有任何样式,请教应该怎么做?谢谢。<style>tabletr:first-child{bac...
比如我做两个表格,第一个表格使用定义好样式,而第二个我只想做个普通的表格,没有任何样式,请教应该怎么做?谢谢。
<style>
table tr:first-child{background:#0066CC; color:#fff;font-weight:bold;} /*第一行标题蓝色背景*/
table{border-top:1pt solid #C1DAD7;border-left:1pt solid #C1DAD7;margin: 0 auto;}
td{ padding:5px 10px; text-align:center;border-right:1pt solid #C1DAD7;border-bottom:1pt solid #C1DAD7;}
tr:nth-of-type(odd){ background:#F5FAFA;} /* odd 标识奇数行,even标识偶数行 */
tr:hover{ background: #E0F0F0;} /*鼠标悬停后表格背景颜色*/
</style>
第一个表格使用上面样式
<table width="600" border="0" cellspacing="0" cellpadding="0" align="center">
<tbody><tr>
<td><div align="left" class="STYLE1">neirong1</div></td>
</tr>
<tr>
<td><div align="left">neirong2</div></td>
</tr>
<tr>
<td><div align="left">neirong3</div></td>
</tr>
</tbody></table><br /><br/>
其他内容。。。。。
第二个表格不想使用上面的样式,只想做普通的表格。
<table width="600" border="0" cellspacing="0" cellpadding="0" align="center">
<tbody><tr>
<td><div align="left">neirong4</div></td>
</tr>
<tr>
<td><div align="left">neirong5</div></td>
</tr>
<tr>
<td><div align="left">neirong6</div></td>
</tr>
</tbody></table><br /><br/> 展开
<style>
table tr:first-child{background:#0066CC; color:#fff;font-weight:bold;} /*第一行标题蓝色背景*/
table{border-top:1pt solid #C1DAD7;border-left:1pt solid #C1DAD7;margin: 0 auto;}
td{ padding:5px 10px; text-align:center;border-right:1pt solid #C1DAD7;border-bottom:1pt solid #C1DAD7;}
tr:nth-of-type(odd){ background:#F5FAFA;} /* odd 标识奇数行,even标识偶数行 */
tr:hover{ background: #E0F0F0;} /*鼠标悬停后表格背景颜色*/
</style>
第一个表格使用上面样式
<table width="600" border="0" cellspacing="0" cellpadding="0" align="center">
<tbody><tr>
<td><div align="left" class="STYLE1">neirong1</div></td>
</tr>
<tr>
<td><div align="left">neirong2</div></td>
</tr>
<tr>
<td><div align="left">neirong3</div></td>
</tr>
</tbody></table><br /><br/>
其他内容。。。。。
第二个表格不想使用上面的样式,只想做普通的表格。
<table width="600" border="0" cellspacing="0" cellpadding="0" align="center">
<tbody><tr>
<td><div align="left">neirong4</div></td>
</tr>
<tr>
<td><div align="left">neirong5</div></td>
</tr>
<tr>
<td><div align="left">neirong6</div></td>
</tr>
</tbody></table><br /><br/> 展开
6个回答
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询