Question

我正在开发一个定位较旧的功能手机类型手机的网站，这些手机的css和html支持有限。我有一个包含单行和两个单元格的表格，每个单元格都包含一个链接。理想情况下，我希望两者都可以点击。我尝试了一个div解决方案，但在我测试的一些手机浏览器上，文本会消失，我假设因为这不完全是语义上的。

关于如何在不使用div的情况下完成此任务的任何建议？

这是我的HTML

<div><table style="width:100%;"><tbody><tr>

<td class="leftTd"><a href="link1"><Left</div></a></td>

<td class="rightTd"><a href="link2>Right</a></td>
</tr></tbody></table></div>

Answer 1

的 DEMO 的

td a { display:block; width:100%; height:100%; }

还修复了错误中的HTML标记：

<div> <table style="width:100%;"> <tr> <td class="leftTd"><a href="link1">Left</a></td> <td class="rightTd"><a href="link2">Right</a></td> </tr> </table> </div>

Answer 2

在第一个链接中，您有一个迷路<。

在第二个中，您没有在href之后关闭引号。

旧手机的浏览器通常不会很好地破坏HTML语法，所以我认为这就是链接无法呈现的原因。

我建议您使用检查HTML语法的编辑器，或至少使用W3C validator之类的检查器。

Answer 3

您提供的HTML标记无效。这是有效的标记

<table style="width:100%;">
    <tbody>
        <tr>
            <td class="leftTd"><a href="link1">Left</a></td>
            <td class="rightTd"><a href="link2">Right</a></td>
        </tr>
    </tbody>
</table>

然后确保a元素设置为display: block;例如

td a {
    display: block;
}

Answer 4

HTML4事件属性

<table border="0" style="cursor:pointer" onMouseover="window.status='http://www.stackoverflow.com/'" onMouseout="window.status=''" onMouseup="window.location='http://www.stackoverflow.com/'" width="158" height="158" style="background-image: url('http://cdn.sstatic.net/stackoverflow/img/apple-touch-icon.png')">
    <tr>
        <td style="display:none;">This entire table is a link with no content</td>
    </tr>
</table>

TD Clickable没有div或javascript

4 个答案: