CSS/HTML 自定义按钮 IFTTT 点击事件

Question

我正在尝试制作一个使用 IFTTT 触发电子邮件的按钮，我使用在网站上绘制按钮的类对按钮进行了编码，单击它时没有任何反应。

    First name:<br>
    <input type="text" name="value1"><br>
    Last name:<br>
    <input type="text" name="value2">
    <div class="button">
        <!--Send E-Mail!-->
        <button name="sendmailbutton" value="send email">Send E-Mail</button>
    </div>

.button {
    background-color: #00FFFF; 
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    border-radius: 2px;
    -webkit-transition-duration: 0.4s; 
    transition-duration: 0.4s;
}

.button:hover {
    background-color: #008b8b; 
    color: white;

Answer 1

问题至少是我的问题； <div> 的 HTML/CSS包含 <button> 的元素只是在插入 <button>进入中心，这意味着您可以单击 <div>但你实际上并没有聚焦/激活按钮。

看看这里(出于显而易见的原因，我已经删除了 key )；

http://plnkr.co/edit/MV075bPS4Oq0dOKrT2vG?p=preview

CSS；

.my-button-css {
    background-color: #00FFFF; 
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    border-radius: 2px;
    -webkit-transition-duration: 0.4s; 
    transition-duration: 0.4s;
}

.my-button-css:hover {
    background-color: #008b8b; 
    color: white;
}

HTML;

<form action="https://maker.ifttt.com/trigger/web_button_pressed/with/key/" method="post">
    First name:<br>
    <input type="text" name="value1"><br>
    Last name:<br>
    <input type="text" name="value2">
    <!--Send E-Mail!-->
    <button class="my-button-css" name="sendmailbutton" value="send email">Send E-Mail</button>
</form>