可以使用jquery来实现 例如 $("table tr:odd")css("background","#fff");或者使用css3,例如table tr:2n{background:#fff;}
我喜欢用CSS+DIV， 代码整洁易修改，易控制，而且代码可以跟HTML标签分离，放到一个独立的文件夹中，可以被多个页面同时引用。CSS代码：<style type="text/css">
{
margin:0px;
padding:0px;
font-size:18px;
}
#user{
height: 20px;
width: 150px;
}
#pwd {
height: 20px;
width: 150px;
margin-left: 17px;
}
#cont {
height: auto;
width: 300px;
background-color:#feccff;
margin:50px auto;
}
form{
display:block;
padding:5px;
border: 1px solid #090;
}
center input{
font-size:16px;
}
</style> HTML代码：<div class="cont" id="cont">
<form action="" method="post">
用户名：<input id="user" name="user" type="text" value="" />
密码：<input id="pwd" name="pwd" type="password" />
<center> <input name="" type="submit" value="提交" /> <input name="" type="reset" value="重置" /></center>
</form>
</div>
您好！以下是最典型的细线表格，具备最基本的设置。供参考：
<!doctype html><html>
<head>
<meta charset="utf-8">
<title>表格CSS设置</title>
<style>
#tb1 {
border-collapse: collapse; / 折叠边框产生细线表格/
border: 2px solid black; / 外框粗线、内部细线表格，表格线为黑色 /
}
#tb2 {
border-collapse: collapse; / 折叠边框产生细线表格/
border: 1px solid red; / 细线表格，表格线为红色 /
}
</style>
</head>
<body>
<br>
<table id="tb1" width="379" height="87" border="1" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td width="123" height="34"> </td>
<td width="122"> </td>
<td width="126"> </td>
</tr>
<tr>
<td height="25"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
<br>
<table id="tb2" width="379" height="89" border="1" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td width="123" height="36"> </td>
<td width="122"> </td>
<td width="126"> </td>
</tr>
<tr>
<td height="25"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
</body>
</html>
显示结果：
建议先学习下CSS基础
问题很简单，在你要控制的元素最外一层元素增加 ID=XXX
并且写内部所有元素样式前都加上 #XXX，这样就被局部化了
如：
<div id=abc><ul><li></li></ul></div>
#abc{这里控制 DIV}
#abc ul{这里控制 ul}
#abc li{这里控制 li}
并不影响ABC以外 的元素，但是ABC会继承父类会全局的样式
1、两个表格定义不同的class，通过class设定不同的样式
如<style>
a{border:2px;}
b{border:10px;}
</style>
2、两个表格定义不同的id，通过id设定不同的样式
如<style>
#a{border:2px;}
#b{border:10px;}
</style>
1所有的<table>均为细边框。
table,table td,table th{border:1px solid #ff0000;border-collapse:collapse;}
2指定的<table>为细边框，把<table>放在<div>中，用ID作索引，如下：
#mdA table,#mdA table td,#mdA table th{border:1px solid #ff0000;border-collapse:collapse;}
<div id="mdA">
<table width="400" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
</div>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）