多选框和按钮标签

多选框和按钮标签

<!--多选框标签
同样需要命名来分组
-->
<p>爱好:
    <input type="checkbox" value="sleep" name="hobby"/>睡觉
    <input type="checkbox" value="eat" name="hobby"/>吃饭
    <input type="checkbox" value="play games" name="hobby"/>打游戏
</p>

<!--按钮标签
1.普通按钮:button
2.图片按钮:image
图片按钮的功能和提交按钮一样，会跳转到form表单标签设置的action网址
3.提交和重置按钮
点击提交按钮会跳转到form表单设置的action网址
点击重置按钮会清空表单
-->
<p>
    按钮: <input type="button" name="btn1" value="按钮1"/> <br>
    图片按钮： <input type="image" name="btn2" src="/com/xy/HTML/resource/image/1.jpg" width="100" height="30"> <br>

    <p>提交和重置按钮 ：
        <input type="submit" name="Button" value="提交"/>
        <input type="reset" name="Reset" value="重置"/>
    </p>
</p>

---

知识点总结：

1. 文本框type=checkbox就是多选框，多选框和单选框一样，也要通过命名的方式来进行分组

2. 按钮标签分为普通按钮button、图片按钮image、提交按钮submit和重置按钮reset

• 普通按钮button需要自己设置点击后的功能

• 图片按钮的功能和提交按钮一样，会跳转到form表单标签设置的action网址

• 点击提交按钮会跳转到action网址

• 点击重置按钮会清空表单，类似于重置

3. 按钮标签是可以设置大小的，以免图片按钮的图片过大导致按钮太大