为什么表不使用body字体大小，即使我没有明确设置表字体大小？ [英] Why is a table not using the body font size even though I haven't set the table font size explicitly?
问题描述
我有一个问题，我已经设置body font-size为11px，但表显示字体为16px。我不知道什么造成这 - 我已经过了CSS和输出（浏览到页面时的源）一次又一次。将表字体大小设置为11px显式具有所需的效果，但是我不需要将它设置为离开body样式的任何位置。
I have a problem whereby I have set the body font-size to 11px, but tables display font at 16px. I have no idea whats causing this - I have been over the CSS and the output (source when browsing to the page) time and time again. Setting table font-size to 11px explicitly has the desired effect, but I shouldnt need to set it anywhere apart from the body style.
我有以下CSS： p>
I have the following CSS:
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
margin: 0px;
background-color: #E7D2B8;
color: #863F2B;
}
img.headerImg {
width: 100%;
}
.menu-strip {
float: left;
width: 20%;
}
.main-content {
float: left;
width: 80%;
}
.clear {
clear: both;
}
ul.menu {
margin: 0px;
margin-left: 10px;
padding: 0px;
list-style: none;
}
ul.menu li {
margin: 0px;
padding: 0px;
padding-top: 10px;
padding-bottom: 10px;
}
div.footer {
width: 60%;
margin-left: 20%;
}
ul.footer-links {
list-style: none;
}
ul.footer-links li {
float: left;
padding: 20px;
}
ul.footer-links li:last {
clear: right;
}
table {
width: 100%;
border-collapse: collapse;
}
td {
vertical-align: top;
}
...并且输出如下：
...and the output is as follows:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="/CustomerApp_v2/CSS/main.css" />
</head>
<body>
<div class="header">
<img class="headerImg" alt="Header image" src="/CustomerApp_v2/Images/header.png" />
</div>
<div class="menu-strip">
<ul class="menu">
<li>Home</li>
<li>Contacts
<ul class="menu">
<li>Customers</li>
<li><a href="/CustomerApp_v2/Agents/Agents.php">Agents</a></li>
<li>Artists</li>
<li>Suppliers</li>
<li>Other</li>
</ul>
</li>
</ul>
</div>
<div class="main-content">
<table>
<thead>
<tr>
<td>Code</td>
<td>Forename</td>
<td>Surname</td>
<td>Address</td>
<td>Postcode</td>
<td>Telephone</td>
<td>Fax</td>
<td>Edit</td>
</tr>
</thead>
<tfoot>
<tr>
<td colspan='7'></td>
<td><a href='/CustomerApp_v2/Agents/Edit.php'>Create</a></td>
</tr>
</tfoot>
<tbody>
<tr>
<td>code4</td>
<td>James</td>
<td>Blue</td>
<td>address11<br />address24<br />address32<br />town5<br /></td>
<td>postcode4</td>
<td>fone4</td>
<td>fone2</td>
<td><a href='/CustomerApp_v2/Agents/Edit.php?ID=2'>Edit</a></td>
</tr>
<tr>
<td>code5</td>
<td>Fred</td>
<td>White</td>
<td>address13<br />address24<br />address31<br />town1<br /></td>
<td>postcode2</td>
<td>fone5</td>
<td>fone3</td>
<td><a href='/CustomerApp_v2/Agents/Edit.php?ID=1'>Edit</a></td>
</tr>
</tbody>
</table>
</div><div class="clear"></div>
<div class="footer">
<ul class="footer-links">
<li>Link 1</li>
<li>Link 2</li>
<li>Link 3</li>
<li>Link 4</li>
<li>Link 5</li>
<li>Link 6</li>
</ul>
</div>
</body>
</html>
我真的看不到任何可以将字体大小设置为16px的表。这发生在所有3个部分（thead，tfoot，tbody）。看来，Netbeans 6.9不会正确格式化表，但它会执行文档的其余部分（前后）。它几乎好像有什么问题的表，但我看不到什么。这发生在Firefox和Opera（两者的最新版本）。我没有在IE中测试它，因为它永远不会在IE中使用。
I seriously cant see anything which could set the font-size to 16px in the table. This happens for all 3 sections (thead, tfoot, tbody). It also seems that Netbeans 6.9 will not format the table properly, but it does the rest of the document (before and after). Its almost as if there is something wrong with the table, but I can't see what. This happens in Firefox and Opera (most recent versions of both). I haven't tested it in IE because it will never be used in IE.
推荐答案
浏览器是否以奇怪的模式？显然怪癖模式重建一些遗留行为，表不能正确继承：
Are the browsers rendering in quirks mode? Apparently quirks mode recreates some legacy behavior where tables do not inherit properly:
这篇关于为什么表不使用body字体大小，即使我没有明确设置表字体大小？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
