使链接/按钮100%可点击

时间:2019-02-18 15:17:24

标签: html button mailchimp

希望有人可以提供帮助。我使用以下代码在mailchimp中创建了一个按钮,以允许我在文本框中使用按钮。看起来不错,我唯一的问题是按钮中的文本是可单击的,但我希望整个按钮都可单击。我已按照此处的建议添加了'display: inline-block',但似乎没有影响

任何人都可以提供任何建议吗?

谢谢

<center>
<table border="0" cellpadding="0" cellspacing="0" style="background-color:#F287B7;" width="60%">
    <tbody>
        <tr>
            <td style="color: rgb(255, 255, 255); font-family: verdana, Arial, sans-serif; font-size: 16px; font-weight: bold; letter-spacing: -0.5px; line-height: 150%; padding: 15px 30px; width: 100%; text-align: center;"><a href="https://www.littlebird.co.uk/membership/join?utm_source=toucan&amp;utm_medium=referral&amp;utm_campaign=toucan15" style="color:#FFFFFF; text-decoration:none;" target="_blank; display: inline-block">Learn More</a></td>
        </tr>
    </tbody>
</table>
</center>

1 个答案:

答案 0 :(得分:0)

您可以使用jQuery进行操作。只需为您的<td>元素提供一个ID或类。 然后使用jQuery创建一个事件“ click”。

<script>
    $(() => {
        $("#clickable").on("click", function () {
            window.open("https://www.littlebird.co.uk/membership/join?utm_source=toucan&amp;utm_medium=referral&amp;utm_campaign=toucan15");
        });
    });
</script>
<center>
    <table border="0" cellpadding="0" cellspacing="0" style="background-color:#F287B7;" width="60%">
        <tbody>
            <tr>
                <td id="clickable"
                    style="cursor: pointer; color: rgb(255, 255, 255); font-family: verdana, Arial, sans-serif; font-size: 16px; font-weight: bold; letter-spacing: -0.5px; line-height: 150%; padding: 15px 30px; width: 100%; text-align: center;">
                    <a href="https://www.littlebird.co.uk/membership/join?utm_source=toucan&amp;utm_medium=referral&amp;utm_campaign=toucan15"
                        style="color:#FFFFFF; text-decoration:none;" target="_blank; display: inline-block">Learn
                        More</a></td>
            </tr>
        </tbody>
    </table>
</center>

您应该导入jQuery库。 看来我已经在style="cursor: pointer;中添加了td来更改光标。