表格边框差异IE9与IE8
[英]Table border difference IE9 vs IE8
问题描述
IE9 displays table, th and td borders differently from IE8. 
IE9与IE8相比，显示表格边框，th和td边框。 What is the reason for this and what can be done about it? 这是什么原因，该怎么办？
As can be seen from below screen prints, the borders seem to have a shaded effect in IE9 which causes them to be not as crisp any more as they were in IE8. 从屏幕截图的下方可以看出，IE9中的边框似乎具有阴影效果，这导致边框不再像IE8中那样清晰。 This seems to apply to solid (table, th) as well as dotted (td) borders. 这似乎适用于实线（表格）和点线（td）边框。
html used 使用的HTML
<!DOCTYPE html
PUBLIC "-//W3C//DTD HTML 4.0//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>table border test</title>
<style type="text/css">
table {
border: solid black 1pt;
border-collapse: collapse;
padding: 0;
border-spacing: 0;
}
th {
background: rgb(255, 255, 153);
border-style: solid;
border-color: black;
border-width: 1pt;
padding: 0cm 5pt;
color: black;
font-family: Verdana;
font-size: 10pt;
font-style: normal;
vertical-align: top;
}
td {
border-style: dotted dotted none none;
border-color: black;
border-width: 1pt;
padding: 0cm 5pt;
color: black;
font-style: normal;
font-family: Verdana;
font-size: 10pt;
vertical-align: top;
margin-bottom: 4.5pt;
margin-top: 0pt;
}
</style>
</head>
<body>
<br>
<table>
<thead>
<tr>
<th class="small">col A</th>
<th class="small">col B</th>
<th class="large">col C</th>
<th class="medium">col D</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center">A1</td>
<td align="center">B1</td>
<td>C1</td>
<td>D1</td>
</tr>
<tr>
<td align="center">A2</td>
<td align="center">B2</td>
<td>C2</td>
<td>D2</td>
</tr>
</tbody>
</table>
</body>
</html>
IE8 result IE8成绩
IE9 result IE9成绩
2 个解决方案
解决方案1
3 已采纳 2012-05-31 09:10:56
The pt unit is a physical unit (1/72 of an inch). pt单位是物理单位（1/72英寸）。 Newer versions of IE probably use subpixel rendering when given something to render that doesn't have a whole number of pixels. 当给定一些不具有全部像素的渲染内容时，较新版本的IE可能会使用子像素渲染。
Physical units are poorly served on screen anyway (as browsers often make poor assumptions about the DPI of the screen), so should be reserved for print media. 无论如何，物理单元在屏幕上的显示效果都很差（因为浏览器经常对屏幕的DPI做出错误的假设），因此应保留用于打印介质。
Use px instead. 请改用px 。
解决方案2
1 2012-05-31 09:07:49
IE9 does not round down your 1pt border to 1px. IE9不会将您的1pt边框舍入到1px。 It's not a bug, it's a feature! 这不是一个错误，这是一个功能！
To solve this you can use px instead of pt, and make sure to use whole numbers. 为了解决这个问题，您可以使用px而不是pt，并确保使用整数。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.