CSS HTML如何在表格中删除整个单元格的链接？

Question

我想要一个带有垂直对齐链接的页脚网页。 因此，我使用了一个表格，在其中写下我的链接，如“Mobile”，“Help”，“Terms”，等等。

问题在于当我将鼠标指向表格时，链���是活动的（即使是空单元格）。 我想要的是，当我将鼠标指向“Mobile”，“Help”，“Terms”等名称时才显示链接 - 而不是当我指向单元格的其余部分或表格的其他任何位置时都显示链接。

我已经在Stackoverflow上研究过这个问题，但总是相反的问题（人们想要激活单元格链接）。

有人能够提供帮助吗？ 以下是代码。

HTML代码：

    <div id="footer">
<div class = "box2">
    <h6><a href="/error">Français</h6>
    <h6><a href="/error">English (US)</h6>
    <h6><a href="/error">Español</h6>
    <h6><a href="/error">Português (Brasil)</h6>
    <h6><a href="/error">Deutsch</h6>
    <h6><a href="/error">Italiano</h6>
    <h6><a href="/error">Русский</h6>
</div>

    <div class = "box3">
        <table class="table2">
            <tr>
                <td><h6><a href="/mobile">Mobile</h6></td>
                <td><h6><a href="/help">Help</h6></td>
                <td><h6><a href="/term">Terms and conditions</h6></td>
                <td><h6><a href="/developers">Developers</h6></td>
                <td><h6><a href="/carriers">Carriers</h6></td>
                <td><h6><a href="/other">Other</h6></td>
            </tr>
            <tr>
                <td><h6><a href="/blog">Blog</h6></td>
                <td><h6><a href="/findus">Find us</h6></td>
                <td><h6><a href="/pics">Pics</h6></td>
            </tr>
        </table>

    </div>
        </div>

CSS 代码

#footer {
    height: 110px;
    background: #80B2E6;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#80B2E6), color-stop(100%,#3385D6));
    background: -moz-linear-gradient(top, #80B2E6 0%, #3385D6 100%);
    background: -webkit-linear-gradient(top, #80B2E6 0%, #3385D6 100%);
    background: -o-linear-gradient(top, #80B2E6 0%, #3385D6 100%);
    background: -ms-linear-gradient(top, #80B2E6 0%, #3385D6 100%);
    background: linear-gradient(top, #80B2E6 0%, #3385D6 100%);
}

.box2
{
    width:800px;
    border-bottom:1px solid lightgrey;
    display:inline-block;
    padding-top:20px;
}

.box3
{
    width:800px;
    padding:0;
}


.table2 {
    width:450px;
    padding:0;
    font-size:11px;
    table-layout: auto;
    float:left;
    border-collapse:collapse;

}


h6 {
    font-weight: normal;
    font-size: 11px;
    max-width: 800px;
    color: white;
    margin:0;
    padding-bottom:3px;
    padding-right:10px;
    /*display:inline-block;*/
    float:left;
}

h6 a:link {
    color:white;
}

.table2 td a {
    color:white;
    display:inline;
}

a:link {
    text-decoration:none;
    color: #54544B;
}

table {
    width:420px;
    /*height: 200px;*/
    padding:10px;
    margin-bottom:10px;
    border-collapse:collapse;
    table-layout: fixed;
}

td
{
    text-align:center;
    position:center;
    padding-top: 3px;
    padding-bottom: 3px;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;
    word-wrap: break-word;
}

tr, div {

}

- Paul

---

关闭你的 <a href>...</a>，我想就可以了 :) - Patrick Ferreira

嘿，谢谢，但这并没有解决问题... - Paul

我只需要关闭<a>标签，就可以了。看看这个jsfiddle。 - Patrick Ferreira

Answer 1

关闭所有链接标签，使用</a>。例如更改：

<td><h6><a href="/mobile">Mobile</h6></td>

to

<td><h6><a href="/mobile">Mobile</a></h6></td>

和所有其他链接

- Think Different

---

实际上，是的，它解决了问题 - 我在HTML文件中做错了什么...谢谢大家！ - Paul