开发者

how do I give a link name to an html table row?

开发者 https://www.devze.com 2023-04-06 19:49 出处:网络
I have a table with each row explaining something (an input command). In an开发者_运维问答other place, I am saying from this state with that input command, you go that other state. What I want to do i

I have a table with each row explaining something (an input command). In an开发者_运维问答other place, I am saying from this state with that input command, you go that other state. What I want to do is to link the that input command to the appropriate row of the table. Imagine something like this:

...link to row number <a href="#row2">2</a>...

<table ...>
    <tr>
        <td>command</td>
        <td>description</td>
    <tr>
    <tr>
        <a name="row1"></a>
        <td>A</td>
        <td>input A</td>
    <tr>
    <tr>
        <a name="row2"></a>
        <td>B</td>
        <td>input B</td>
    <tr>
</table>

As you can see, I tried putting a <a name="row2"></a> in the <tr> block but that didn't work (it brings me to the top of the table)

Is what I want to do possible?


You do one of two things:

1) Set the id attribute of the <tr>. <tr id="row2">...</tr>

OR

2) put the <a> element inside the <td> element. If you put any element inside a <table> but not inside a <th> or <td>, it'll get rendered before the entire table (try it with any element, the browser does its best to correct the invalid HTML)


Although non-intuitive for me, but I put the <a name="row2"></a> inside the first <td> block and it worked!


<tr>
    <td><a name="row2"></a></td>
    <td>B</td>
    <td>input B</td>
<tr>


You could do a "dummy" anchor row:

<table ...>
    <tr>
        <td>command</td>
        <td>description</td>
    <tr>
    <tr>
        <td colspan="2" style="height: 1px;"><a name="row1"></a></td>
    <tr>
    <tr>
        <td>A</td>
        <td>input A</td>
    <tr>
    <tr>
        <td colspan="2" style="height: 1px;"><a name="row2"></a></td>
    <tr>
    <tr>
        <td>B</td>
        <td>input B</td>
    <tr>
</table>

If you have styling on your table (borders, background, etc) this might be visible, but you could always style these rows like separators or camouflage them.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号