如何将我的样式按钮与表单链接？答案

【问题标题】：How Can I link My Styled Button With a Form?如何将我的样式按钮与表单链接？
【发布时间】：2012-08-25 22:35:47
【问题描述】：

这是我的代码：

<div class="container">

    <form id="signup">

        <div class="inputs">

            <input type="email" required="required" placeholder="Your Email" autofocus=""/>

            <input type="password" required="required" placeholder="Desired Password" />


            <a id="submit" onclick="confirmation()">REQUEST INVITE NOW</a>

        </div>

    </form>


</div>

【问题讨论】：

jQuery 方法stackoverflow.com/a/4674648/1586079

标签： html forms button submit

【解决方案1】：

您可以只使用真正的提交输入元素<input type="submit" id="submitbutton" />，然后使用 CSS 来设置按钮样式

input#submitbutton{
/*CSS GOES HERE*/
}

或者，如果您不使用外部样式表，则可以使用 <input type="submit" id="submitbutton" style="CSS GOES HERE" /> 之类的方式在 HTML 中添加 CSS

【讨论】：

【解决方案2】：

发布的不是按钮，只是附带事件的文本。如果您希望 [submit] 输入看起来相似，请参见代码示例 style=""，修改所需效果。此输入将帮助您传递 <input type="email" /> 和 <input type="password" /> 值。在电子邮件、密码和提交输入中使用name="email" 而不是id="email" 属性以使其正常工作。

    <form action="" method="post">
      <input type="email" name="email" required="required" placeholder="Your Email" autofocus=""/>
      <input type="password" name="password" required="required" placeholder="Desired Password" />
      <input type="submit" name="PICK-ME" value="REQUEST INVITE NOW" style="background: transparent; border-top: 0; border-right: 0; border-bottom: 1px solid #333333; border-left: 0; color: #42413C; display: inline; margin: 0; padding: 0; font-family: Verdana, Arial, Helvetica, sans-serif; font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;" />
    </form>

【讨论】：