您现在的位置是:首页 > 学无止境> CSS3|HTML5网站首页学无止境CSS3|HTML5

用图片或文字作为提交/重置按钮

按钮  
简介用图片或文字作为提交/重置按钮的三种方法

提交:

第一种方式(无图片的): <input  type="submit" value="提交" />

第二种方式(有图片的): <input type="image" src="image/login.jpg" />

第三种方式(有图片的),通过链接的方式:

<form name="form1" action="login">
<input type="text" name="usename"/><br/>
<input type="password" name="password" /><br/><br/>
<!--提交-->
<a href= "javascript:document.form1.submit(); " >
<img src= "image/login.jpg " border="0">
</a>
</form>

重置:

第一种方式(无图片的): <input  type="reset" value="重置" />

第二种方式(有图片的):
<form name="form1" action="login">
<input type="text" name="usename"/><br/>
<input type="password" name="password" /><br/><br/>
<input type="image" src="image/login.jpg" />  <!--提交-->
<!--重置-->
<a href="javascript:document.form1.reset();"><img src="image/reset.jpg" border="0"></a>
</form>

<img src="images/cz.gif" onclick="this.form.reset()" width="57" height="20">
这样就不会产生提交了.

或者
<input type="image" src="images/cz.gif" onclick="this.form.reset();return false;" width="57" height="20">

上一篇:表单提交tips提示

下一篇:返回列表

Top