html表单按钮有,用好表单的按钮（一）_html

对于一个交互式表单，按钮是必不可少的。按钮一般分为两类，一类本身就具有特定的功能，叫做特殊按钮，如Submit(提交按钮)――用于传输用户所填写的信息至服务器、Reset(复原按钮)――清除所填写的信息以利重新填写；另一类本身不具特殊功能的，叫作普通按钮。特殊按钮只能用于表单才能发挥特殊的功能。而普通按钮除可在表单中应用外，在网页的其它地方使用也很方便。

一、制作常规按钮

制作按钮非常简单，在标记中把type参数设置为：type=”submit”就获得一个提交按钮，如本例的“提交”按钮；在 标记中把type参数设置为：type=”reset”就获得一个复原按钮，如本例的“重写”按钮；在标记中把type参数设置为：type=”button”就获得一个普通按钮。本例的按钮源代码如下：

按钮的制虽简单，但在制作按钮时要注意两点：

1、对于特殊按钮，一般不需另加动作，当按下按钮时就有动作发生；而对于普通按钮，必须加上指定的动作并用相就的事件来触发，才会在事件发生时激发动作，否则按下普通按钮，什么也不发生。在本例的普通按钮上加了一个弹出提示窗口的动作：alert(‘谢谢您点击！’)，并用onclick事件来触发，所以当你在那个按钮上点击时会弹出一个窗口，并显示“谢谢您点击！”这句话。

2、按钮上的文字是通过设置value参数来实现的，其默认值是英文名。

二、改变按钮的外观

html对文本提供了丰富的颜色设置，唯独对表单按钮默认的则是Windows系统的颜色，显得有点死板，而且也没有提供按钮的颜色设置参数，因此，要改变表单按钮的外观，只能借助于css了。请看下面的示例：

你看！这个按钮是不是变了样，新鲜多了吧？我们来看看它的源代码作了那些改变。按钮源代码：

从源代码中可以看出，按钮的基本参数设置没变，只是加了一段CSS代码，正是这段CSS代码改变了按钮的外观风格。在这段CSS代码中，不仅重新设置了表单按钮的背景色和字号大小，而且还对按钮的边框线进行了设置，把上边框线、左边框线设置浅一点的颜色，而把下边框线、右边框线设置深一点的颜色，其目的是使表单按钮产生立体效果。当然，你可以任意改变CSS代码中颜色，以使按钮的颜色与所在网页的颜色协调。

欢迎大家阅读《用好表单的按钮(一)_html》,跪求各位点评,若觉得好的话请收藏本文，by 搞代码

搞代码网(gaodaima.com)提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权

转载请注明原文链接：用好表单的按钮(一)_html