css - 如何讓超連結範圍的可點區域佔滿欄位?



一般正常情況下,設定超連結後的點選範圍只有那一行,
不過有時候套用在表格某個欄位時,
想要況大此點選區域,該怎麼做呢?

CSS語法

td {
    overflow: hidden;
}
td a {
    display: block;
    margin: -10em;
    padding: 10em;
}

HTML語法:
<table border=1>
  <thead>
    <tr>
      <th> 1</th>
      <th class="col-md-3">2</th>
      <th class="col-md-2">3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>測試 </td>
      <td height="100px"><a href="http://blog.webgolds.com/">webgolds 區域變大</a></td>
      <td>WEFEF</td>
    </tr>
    
    <tr>
      <td> </td>
      <td>台灣金站測試測試</td>
      <td height="150px"><a href="http://blog.webgolds.com/view/196-css---如何讓超連結範圍的可點區域佔滿欄位">webgolds 整片都可以點</a></td>
    </tr>
    
  </tbody>
</table>


成果展示:

回上一頁

相關文章:

喜歡這篇文章嗎?立即分享

Posted : / Views: 3478
Last updated :2017-06-22