Question

没有“a”标签，没关系：

<style type="text/css">
body {
    font: 1.0em verdana, arial, sans-serif;
}

* {
    margin:0; padding:0;
}

</style>

<table cellpadding="0" cellspacing="0" border="0">
        <tr>
                <td><img src="/images/title_equipment.gif" /></td>
                <td><img src="/images/about.gif" /></td>
                <td><img src="/images/services.gif" /></td>
                <td><img src="/images/systems.gif" /></td>
                <td><img src="/images/equipment_new.gif" /></td>
                <td><img src="/images/equipment_used.gif" /></td>
                <td><img src="/images/news.gif" /></td>
                <td><img src="/images/contact.gif" /></td>
        </tr>
        <tr>
                <td><img src="/images/balers.gif" /></td>
        </tr>
</table>

但是如果在“img”之外添加“a”标签，边框就会出现：

<style type="text/css">
body {
    font: 1.0em verdana, arial, sans-serif;
}

* {
    margin:0; padding:0;
}

</style>

<table cellpadding="0" cellspacing="0" border="0">
        <tr>
                <td><a href="#"><img src="/images/title_equipment.gif" /></a></td>
                <td><a href="#"><img src="/images/about.gif" /></a></td>
                <td><a href="#"><img src="/images/services.gif" /></a></td>
                <td><a href="#"><img src="/images/systems.gif" /></a></td>
                <td><a href="#"><img src="/images/equipment_new.gif" /></a></td>
                <td><a href="#"><img src="/images/equipment_used.gif" /></a></td>
                <td><a href="#"><img src="/images/news.gif" /></a></td>
                <td><a href="#"><img src="/images/contact.gif" /></a></td>
        </tr>
        <tr>
                <td><img src="/images/balers.gif" /></td>
        </tr>
</table>

Answer 1

这是某些浏览器的默认行为，包括IE。你需要将它添加到你的CSS：

a img {
    border:0;
}

Answer 2

<img src="" border="0" />

或与css

border：0;

Answer 3

这很容易，但有一个技巧

a img { border:none; vertical-align:top; }

将“a”标记放在“img”标记之外时出现边框

3 个答案: