HTML:table里面嵌套table,为什么没有实现隔行变色的效果呢
<%@pagelanguage="java"import="java.util.*"pageEncoding="GBK"%><html><head><styletype=...
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<html>
<head><style type="text/css">
td {
width: 40px;
}
</style>
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(function() {
$("#wrap tr").each(function(i) {
this.style.backgroundColor = ['#ccc', '#fff' ][i % 2];
});
});
</script>
</head>
<body>
<table id="wrap">
<tr>
<table border="1">
<tr><td>Demo</td><td>Demo</td></tr>
<tr><td>Demo</td><td>Demo</td></tr>
</table>
</tr>
<tr>
<table border="1">
<tr><td>Check</td><td>Check</td></tr>
<tr><td>Check</td><td>Check</td></tr>
</table>
</tr>
<tr>
<table border="1">
<tr><td>Test</td><td>Test</td></tr>
<tr><td>Test</td><td>Test</td></tr>
</table>
</tr>
</table>
</body>
</html> 展开
<html>
<head><style type="text/css">
td {
width: 40px;
}
</style>
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(function() {
$("#wrap tr").each(function(i) {
this.style.backgroundColor = ['#ccc', '#fff' ][i % 2];
});
});
</script>
</head>
<body>
<table id="wrap">
<tr>
<table border="1">
<tr><td>Demo</td><td>Demo</td></tr>
<tr><td>Demo</td><td>Demo</td></tr>
</table>
</tr>
<tr>
<table border="1">
<tr><td>Check</td><td>Check</td></tr>
<tr><td>Check</td><td>Check</td></tr>
</table>
</tr>
<tr>
<table border="1">
<tr><td>Test</td><td>Test</td></tr>
<tr><td>Test</td><td>Test</td></tr>
</table>
</tr>
</table>
</body>
</html> 展开
1个回答
展开全部
<html>
<head><style type="text/css">
table.list tr{padding: 10px;}
td{
width: 40px;
}
.list_con_bg{background-color: yellow;}
</style>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<table class="list">
<tr>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
</tr>
<tr>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
</tr>
<tr>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
</tr>
</table>
<script type="text/javascript">
$(document).ready(function(){
$(".list tr:even").addClass("list_con_bg");
});
</script>
</body>
</html>
用这种
<head><style type="text/css">
table.list tr{padding: 10px;}
td{
width: 40px;
}
.list_con_bg{background-color: yellow;}
</style>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<table class="list">
<tr>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
</tr>
<tr>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
</tr>
<tr>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
<td>Demo</td>
</tr>
</table>
<script type="text/javascript">
$(document).ready(function(){
$(".list tr:even").addClass("list_con_bg");
});
</script>
</body>
</html>
用这种
追问
需要table嵌套table的
追答
table.list tr{padding: 10px;}
td{
width: 40px;
}
.list_con_bg{background-color: yellow;}
Demo
Demo
Demo
Demo
$(document).ready(function(){
$(".list tr.bs:even").addClass("list_con_bg");
});
你把 .....多复制几个看看效果
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询