2

IE9 显示 table、th 和 td 的边框与 IE8 不同。这是什么原因以及可以做些什么呢?
从下面的屏幕打印中可以看出,IE9 中的边框似乎具有阴影效果,这导致它们不再像 IE8 中那样清晰。这似乎适用于实心 (table, th) 以及虚线 (td) 边框。

使用的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 结果

IE8 结果

IE9 结果

IE9 结果

4

2 回答 2

3

pt单位是物理单位(1/72 英寸)。较新版本的 IE 可能会在给定没有整数像素的渲染对象时使用亚像素渲染。

无论如何,物理单位在屏幕上的服务质量很差(因为浏览器通常对屏幕的 DPI 做出错误的假设),因此应该为打印媒体保留。

改为使用px

于 2012-05-31T09:10:56.203 回答
1

IE9 不会将您的 1pt 边框四舍五入为 1px。这不是一个错误,这是一个功能!

要解决这个问题,您可以使用 px 而不是 pt,并确保使用整数。

于 2012-05-31T09:07:49.597 回答