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

时间:2014-06-20 08:34:24

标签: html css hyperlink html-table

我想要一个带有页脚的网页,其中有垂直对齐的链接。 我正在使用一张桌子,在其中我写了我的链接,例如" Mobile"," Help"," Terms",...

问题在于,当鼠标指向表格时,链接处于活动状态(即使在空单元格上也是如此)。当我将鼠标指向名称"移动","帮助","条款"时,我希望单独链接。 - 当我指向电池的其余部分时,以及桌子上的其他任何地方时都不会。

我在Stackoverflow上研究了这个问题,但总是反向问题(人们希望激活单元链接)。

有人可以帮忙吗?代码如下。

HTML CODE

    <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 {

}

1 个答案:

答案 0 :(得分:3)

使用</a>关闭所有链接标记。例如改变

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

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

以及所有链接的其余部分