web開發(fā)---給<td>添加超鏈接

發(fā)表時(shí)間：2014-12-28

發(fā)布人：葵宇科技

瀏覽次數(shù)：52

我們經(jīng)常用td來做nav導(dǎo)航那給<td> 添加超鏈接就是比較常用的需求

直接 <a><td></td></a>不符合標(biāo)準(zhǔn)

只能 <td><a></a></td> 但此時(shí) 超鏈接只有鼠標(biāo)直到a標(biāo)簽時(shí)才生效并不是進(jìn)入td就生效

這個(gè)時(shí)候我們只要把 a標(biāo)簽變成塊級(jí)元素即可

<td width="92" class="nav" ><a href="#">HOME</a></td>

然后

<style>
.nav a {
        display:block; /* 把行內(nèi)元素 變成 塊級(jí)元素 */
        width:92px; /* 盒子 寬度 與td寬度一致*/
        height:37px; /* 盒子 高度與td高度一致 */
        text-decoration: none;
        vertical-align: middle;/* 使a的文本垂直居中 */
        
    }

.nav{
 background:#0E0D0D;
width:92px;   
 text-align: center;     /* 使a的文本水平居中 */
 white-space:nowrap;
color:#ffffff;
cursor:pointer;
line-height:37px; /* 使a的文本垂直居中 要與a標(biāo)簽的高度一致 */
}
</style>