时间戳

首页 > 解决方案 > 有没有办法建立从表格到行/单元格的链接？

html - 有没有办法建立从表格到行/单元格的链接？

问题描述

我需要一个词，当单击（如链接）时，它将转到表格上的特定行，所有这些都在同一页面上。我有一个这种格式的表：

<div id="table1">
<table width='100%' id = 'table1'>
    <tr>
        <th><b>Coluna1:</b></th>
        <th><b>Coluna2:</b></th>
    </tr>
    <tr>
        <td>Word1</td>
        <td>Text1</td>
    </tr>
    <tr>
        <td>Word2</td>
        <td>Text2</td>
    </tr>
    <tr>
        <td>Word3</td>
        <td>Word3</td>
    </tr>
</table>

我怎样才能做到这一点？

标签： htmlcss

解决方案

是的，您可以通过id为要转到的每一行/单元格设置 s 并链接到 s来做到这一点#<id>。

@keyframes highlight {
  from { background-color: yellow; }
  to { background-color: #0000; }
}

:target {
  animation: highlight 1s linear;
}
<p>Go to</p>
<ul>
  <li><a href="#word1">Word1</a></li>
  <li><a href="#text1">Text1</a></li>
  <li><a href="#row1">Row1</a></li>
  <li><a href="#text2">Text2</a></li>
</ul>

<table width='100%' id ="table1">
    <tr>
        <th><b>Coluna1:</b></th>
        <th><b>Coluna2:</b></th>
    </tr>
    <tr id="row1">
        <td id="word1">Word1</td>
        <td id="text1">Text1</td>
    </tr>
    <tr id="row2">
        <td id="word2">Word2</td>
        <td id="text2">Text2</td>
    </tr>
    <tr>
        <td>Word3</td>
        <td>Word3</td>
    </tr>
</table>

推荐阅读