日期:2014-05-17  浏览次数:20837 次

这么简单的变态问题,谁能帮我解释清楚?
使用strict类型,一个网页中就放一个一行一列的表格,表格里就放一个图片,则怎么老觉得图片跟边框之间多了4px的间隙呢?谁能帮我解释清楚?代码如下:

HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title></title>
</head>
<body>
    <table border="0" cellspacing="0" cellpadding="0" bgcolor="red" >
        <tr>
            <td bgcolor="blue"><img src="chinamap.jpg" /></td>
        </tr>
    </table>
</body>
</html>



效果如下:




------解决方案--------------------
确实是这样,解决方案就是<img src="chinamap.jpg" style="display:block"/>
可能默认是inline的场合多3px的空白
------解决方案--------------------
设置td的font-size:0;即可;你试试~~
HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title></title>
<style>
*{margin:0;padding:0;}
table td{border:1px solid red; font-size:0;}
</style>
</head>
<body>
    <table border="0" cellspacing="0" cellpadding="0" bgcolor="red" >
        <tr>
            <td bgcolor="blue"><img src="未命名.jpg" /></td>
        </tr>
    </table>
</body>
</html>