Css 样式未应用于divs下的表
小提琴： Html:Css 样式未应用于divs下的表,css,html,Css,Html,小提琴： Html: <!DOCTYPE html> <html> <head> <title>Table Pagination</title> <style> body { font-family: Tahoma; } h3 { background-color: rgb(232, 232, 232);
<!DOCTYPE html>
<html>
<head>
<title>Table Pagination</title>
<style>
body {
font-family: Tahoma;
}
h3 {
background-color: rgb(232, 232, 232);
font-size: 14px;
font-weight: bold;
color: gray;
width: 786px;
height:25px;
margin:2em auto;
padding-top:10px;
padding-left:8px;
margin-bottom: -23px;
border: 1px solid;
border-color: #888888;
}
table {
table-layout: fixed;
font-size: 12px;
width: 810px;
margin: 2em auto ;
}
thead {
background:rgb(232, 232, 232);
color: gray;
height:20px;
}
td {
width: 10em;
height:20px;
word-wrap: break-word;
}
#localFileCopyingDiv, #supplementaryMaterialsDiv, #assetsDiv, table tr td:nth-child(1 /*this is the column number*/){
text-align: center;
width:30px
}
#localFileCopyingDiv, #supplementaryMaterialsDiv, #assetsDiv, table tr td:nth-child(2 /*this is the column number*/) {
width:250px
}
#localFileCopyingDiv, #supplementaryMaterialsDiv, #assetsDiv, table tr td:nth-child(3 /*this is the column number*/) {
width:250px
}
#localFileCopyingDiv, #supplementaryMaterialsDiv, #assetsDiv, table tr td:nth-child(4 /*this is the column number*/){
width:60px
}
#localFileCopyingDiv #supplementaryMaterialsDiv, #assetsDiv, table tr td:nth-child(5 /*this is the column number*/) {
width:220px
}
tbody {
background:#D8D8D8
}
div.pager {
width: 799px;
text-align: left;
margin: 0 auto;
margin-top: -20px;
}
div.pager span {
display: inline-block;
width: 10px;
height: 10px;
cursor: pointer;
background:rgb(156, 187, 203);
color: #fff;
margin-right: 0.5em;
font-size: 13px;
padding-top: 8px;
padding-left:8px;
padding-bottom: 8px;
padding-right:8px;
}
div.pager span.active {
background: rgb(123, 167, 198);
}
.highlightedRow {
color : red;
}
#fileWritingDiv table tbody {
color : red;
}
</style>
<script type="text/javascript" src="resources/javascripts/jquery-1.9.1.min.js"></script>
</head>
<body>
<div id="localFileCopyingDiv">
<h3>Local File Copying Info:</h3>
<table class="paginated">
<thead>
<tr>
<td>No.</td>
<td>Local File Locataion</td>
<td>Server File Locataion</td>
<td>Status</td>
<td>Error Cause</td>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>Error</td>
<td>asudhasiodjiposadhsoapidyhwuiqohdisakdnsakljhndiuosahdioasndioasyhdiuosadosadhaosiydiosadosahydiosahdosahdoysadhiosadosayhdiosahdiosahdiosadsad</td>
</tr>
<tr>
<td>1</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>Error</td>
<td>asudhasiodjiposadhsoapidyhwuiqohdisakdnsakljhndiuosahdioasndioasyhdiuosadosadhaosiydiosadosahydiosahdosahdoysadhiosadosayhdiosahdiosahdiosadsad</td>
</tr>
<tr>
<td>1</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>Error</td>
<td>asudhasiodjiposadhsoapidyhwuiqohdisakdnsakljhndiuosahdioasndioasyhdiuosadosadhaosiydiosadosahydiosahdosahdoysadhiosadosayhdiosahdiosahdiosadsad</td>
</tr>
</tbody>
</table>
</div>
<div id="supplementaryMaterialsDiv">
<h3>Supplementary Materials:</h3>
<table class="paginated">
<thead>
<tr>
<td>No.</td>
<td>Local File Locataion</td>
<td>Server File Locataion</td>
<td>Status</td>
<td>Error Cause</td>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>Error</td>
<td>asudhasiodjiposadhsoapidyhwuiqohdisakdnsakljhndiuosahdioasndioasyhdiuosadosadhaosiydiosadosahydiosahdosahdoysadhiosadosayhdiosahdiosahdiosadsad</td>
</tr>
<tr>
<td>1</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>Error</td>
<td>asudhasiodjiposadhsoapidyhwuiqohdisakdnsakljhndiuosahdioasndioasyhdiuosadosadhaosiydiosadosahydiosahdosahdoysadhiosadosayhdiosahdiosahdiosadsad</td>
</tr>
<tr>
<td>1</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>Error</td>
<td>asudhasiodjiposadhsoapidyhwuiqohdisakdnsakljhndiuosahdioasndioasyhdiuosadosadhaosiydiosadosahydiosahdosahdoysadhiosadosayhdiosahdiosahdiosadsad</td>
</tr>
</tbody>
</table>
</div>
<div id="assetsDiv">
<h3>Assets:</h3>
<table class="paginated">
<thead>
<tr>
<tr>
<td>No.</td>
<td>Local File Locataion</td>
<td>Server File Locataion</td>
<td>Status</td>
<td>Error Cause</td>
</tr>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>Error</td>
<td>asudhasiodjiposadhsoapidyhwuiqohdisakdnsakljhndiuosahdioasndioasyhdiuosadosadhaosiydiosadosahydiosahdosahdoysadhiosadosayhdiosahdiosahdiosadsad</td>
</tr>
<tr>
<td>1</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>Error</td>
<td>asudhasiodjiposadhsoapidyhwuiqohdisakdnsakljhndiuosahdioasndioasyhdiuosadosadhaosiydiosadosahydiosahdosahdoysadhiosadosayhdiosahdiosahdiosadsad</td>
</tr>
<tr>
<td>1</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>D:\local\asdsad\asdsad\asdsad\\asdsadsa</td>
<td>Error</td>
<td>asudhasiodjiposadhsoapidyhwuiqohdisakdnsakljhndiuosahdioasndioasyhdiuosadosadhaosiydiosadosahydiosahdosahdoysadhiosadosayhdiosahdiosahdiosadsad</td>
</tr>
</tbody>
</table>
</div>
<div id="fileWritingDiv">
<h3>File Writing Status</h3>
<table>
<thead>
<tr>
<td>File Name</td>
<td>Error Cause</td>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>2</td>
</tr>
</tbody>
</table>
</div>
<script type="text/javascript"
src="resources/javascripts/tablePagination.js" /></script>
</body>
</html>
.paginated tbody tr td:nth-child(2) {
text-align: center;
width:30px;
}
请注意，在资产表中，TR中有一个TR
<table class="paginated">
<thead>
<tr> <----
<tr>
<td>No.</td>
<td>Local File Locataion</td>
<td>Server File Locataion</td>
<td>Status</td>
<td>Error Cause</td>
</tr>
</tr> <----
</thead>
<tbody>
看起来是这样的：确保你的路径正确小提琴：不解决你的精确问题，但从语义上来说，我会要求你在第一个孩子身上使用th而不是td，如果他们是头一个孩子的话。Div style不适用吗？
<table class="paginated">
<thead>
<tr> <----
<tr>
<td>No.</td>
<td>Local File Locataion</td>
<td>Server File Locataion</td>
<td>Status</td>
<td>Error Cause</td>
</tr>
</tr> <----
</thead>
<tbody>