千锋教育-做有情怀、有良心、有品质的职业教育机构

400-811-9990
手机站
千锋教育

千锋学习站 | 随时随地免费学

千锋教育

扫一扫进入千锋手机站

领取全套视频
千锋教育

关注千锋学习站小程序
随时随地免费学习课程

上海
  • 北京
  • 郑州
  • 武汉
  • 成都
  • 西安
  • 沈阳
  • 广州
  • 南京
  • 深圳
  • 大连
  • 青岛
  • 杭州
  • 重庆
当前位置:沈阳千锋IT培训  >  技术干货  >  表单按钮(下)

表单按钮(下)

来源:千锋教育
发布人:
时间: 2022-11-24 17:41:17

  表单 input 控件中的按钮。

  接着学习第四类按钮:图像按钮。它的功能和提交按钮一样,只是用图片代替了提交按钮的外观。

图片6

  定义图像按钮的语法为:input 输入控件的 type 值定义为 image,意为图像。既然是图像按钮,那就需要引入一张图片,所以还需要定义 src 属性,属性值,为图片的路径。

  回到编辑器,继续在 input_button.html 页面中操作,在普通按钮后面添加一个新的 input,并将 type 属性赋值为 image,再定义一个 src 属性,图片的路径为 logo.png。

  回到浏览器,一个冰墩墩的图像按钮就做好了。当鼠标滑到图片上时,指针变成了小手。填写一些数据,单击图像按钮,表单提交了。

图片7

图片8

  如果你嫌图片太大,可以给这个图像按钮的 input 添加 width 和 height 属性,设置成你想要的大小,可以自己动手试试。

  继续学习第五类按钮:双标签 button 按钮。双标签 button也能实现表单的提交功能。

  定义它的语法为:尖角号button 尖角号/button,按钮的名字在标签里定义。  ()

  回到编辑器,在图像按钮后面定义定义 button 标签,在标签里定义按钮的名字 "button按钮"。保存。

  回到浏览器,刷新,双标签 button 按钮制作完成了。输入一点测试数据,点击button按钮,表单提交了。

  提示一下,双标签 button 按钮在 form 里,默认具备点击提交表单的能力。如果为它添加 type 属性,赋值为 button,它就变成了普通的按钮。

  回到编辑器,在button标签上定义 type 属性,值为 button。保存。

  回到浏览器,刷新。单击 "button按钮",提交表单的功能消失了。

声明:本站稿件版权均属千锋教育所有,未经许可不得擅自转载。

10年以上业内强师集结,手把手带你蜕变精英

请您保持通讯畅通,专属学习老师24小时内将与您1V1沟通

免费领取

今日已有369人领取成功

刘同学 138****2860 刚刚成功领取
王同学 131****2015 刚刚成功领取
张同学 133****4652 刚刚成功领取
李同学 135****8607 刚刚成功领取
杨同学 132****5667 刚刚成功领取
岳同学 134****6652 刚刚成功领取
梁同学 157****2950 刚刚成功领取
刘同学 189****1015 刚刚成功领取
张同学 155****4678 刚刚成功领取
邹同学 139****2907 刚刚成功领取
董同学 138****2867 刚刚成功领取
周同学 136****3602 刚刚成功领取

猜你喜欢LIKE

抖音流量池到底是什么概念?

2022-11-25

直播间场景的重要性以及有什么影响?

2022-11-25

表单的数据采集和提交

2022-11-24

最新文章NEW

小店体验分越来越低,该如何提升分数?

2022-11-28

为什么开播的时候在线人数很高,随着直播时长越往后在线人数越少?

2022-11-25

新号在线人数稳定一段时间后,为什么最近在线人数突然就掉到很少了?

2022-11-25

相关推荐HOT

更多>>

快速通道 更多>>

最新开班信息 更多>>

网友热搜 更多>>