button图像作为表单input提交button？
<form method="post" action="confirm_login_credentials.php"> <table> <tr> <td>User ID:</td> <td><input type="text" id="uid"></td> </tr> <tr> <td>Password:</td> <td><input type="text" id="pass"></td> </tr> <tr> <td colspan="2" align="right"> <a href="#"><img src="images/login.jpg"></a> </td> </tr> </table> </form> 我正在使用图像来代替提交button。 当用户点击login图像时，如何提交login信息？
你可以使用图像提交button ：
<input type="image" src="images/login.jpg" alt="Submit Form" />
谈话迟到…
但是，为什么不使用CSS呢？ 这样，你可以保持button提交types：
<input type="submit" value="go" style="background:url(http://img.dovov.comsubmit.png) no-repeat;" />
奇迹般有效。
您也可以使用第二个图像来提供按下button的效果。 只需在input图像之前的HTML添加“按下”button图像：
<img src="http://integritycontractingofva.comhttp://img.dovov.comgo2.jpg" id="pressed"/> <input id="unpressed" type="submit" value=" " style="background:url(http://integritycontractingofva.comhttp://img.dovov.comgo1.jpg) no-repeat;border:none;"/>
并使用CSS来更改hover时的“未压缩”图像的不透明度：
#pressed, #unpressed{position:absolute; left:0px;} #unpressed{opacity: 1; cursor: pointer;} #unpressed:hover{opacity: 0;}
我在这个页面上使用蓝色的“GO”button
<div class="container-fluid login-container"> <div class="row"> <form (ngSubmit)="login('da')"> <div class="col-md-4"> <div class="login-text"> Login </div> <div class="form-signin"> <input type="text" class="form-control" placeholder="Email" required> <input type="password" class="form-control" placeholder="Password" required> </div> </div> <div class="col-md-4"> <div class="login-go-div"> <input type="image" src="../../../assetshttp://img.dovov.comsvg/login-go-initial.svg" class="login-go" onmouseover="this.src='../../../assetshttp://img.dovov.comsvg/login-go.svg'" onmouseout="this.src='../../../assetshttp://img.dovov.comsvg/login-go-initial.svg'"/> </div> </div> </form> </div> </div>
这是它的工作代码。
使提交button成为您正在使用的主要图像。 所以表单标签会先来，然后提交button，这是你唯一的图像，所以图像是你的可点击的图像forms。 然后只要确保把提交button代码之前传递的任何东西。
