html5--3.16 button元素

html5--3.16 button元素

学习要点

  • 掌握button元素的使用

button元素

    • 用来建立一个按钮从功能上来说,与input元素建立的按钮相同
    • button元素是双标签,其内部可以配置图片与文字,进行更复杂的样式设计
    • 不仅可以在表单中使用,还可以在其他块元素和内联元素中使用

 

  • button元素的属性
    • type属性:可以设置三个值 submit/reset/button与input元素设置的按钮含义相同
    • name/vlue/disable属性:与input的用法相同
    • autofocus属性:设置按钮自动获得焦点。
    • form属性:设定按钮隶属于哪一个或多个表单
    • formmethod属性:设定表单的提交方式,将覆盖原本的提交方式
    • formnovalidate属性:设定表单将会覆盖原本的novalidate属性
    • fomaction属性:指定表单数据发送对象,将覆盖原来的action属性设定
    • formenctype属性;指定表单的数据发送类型,将覆盖原本的enctype属性设定
    • formtarget属性:将覆盖原本的target属性设定

重要事项:如果在表单中使用 button 元素,不同的浏览器会提交不同的值。Internet Explorer 将提交 button元素开始标签与结束标签之间的文本,而其他浏览器将提交 value 属性的内容。最好就是在表单中使用 input 元素来创建按钮。其他地方使用button创建按钮

 

实例

 

 1 <!doctype html>
 2 <html>
 3 <head>
 4 <meta charset="utf-8">
 5 <title>无标题文档</title>
 6 </head>
 7     <p style="color:#FF0000">
 8     </p>
 9     <form action="L3_01.html" method="get" >
10         用户名:<input type="text" name="name" size="30"><br><br>
11         意见:<textarea name="textarea" id="" cols="30" rows="5" placeholder="请输入您的意见,谢谢!!" style="background: #F0FFFF"></textarea><br>
12 <!--        <br><input type="submit" value="确定"> <input type="reset"><br>-->
13         <br><button type="submit" style="background: #FFF0FF;border-radius: 10px;padding: 10px"><img src="pen.jpg" alt="" width="12px">提交</button> 
14         <button type="reset" style="background: #FFFFF0;border-radius: 10px;padding: 10px">重置</button><br>
15         
16     </form>
17 <body>
18 </body>
19 </html>

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/392069.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何注册鸿蒙id,鸿蒙系统真机调试证书 和 设备ID获取

鸿蒙系统真机调试创建项目创建项目创建应用创建鸿蒙应用(注意&#xff0c;测试阶段需要发邮件申请即可)关联应用项目进入关联 添加引用准备调试使用的 p12 和证书请求 csr使用以下命令// 别名"test"可以修改&#xff0c;但必须前后一致&#xff0c;密码请自行修改key…

读zepto核心源码学习JS笔记(3)--zepto.init()

上篇已经讲解了zepto.init()的几种情况,这篇就继续记录这几种情况下的具体分析. 1. 首先是第一种情况,selector为空 既然是反向分析,那我们先看看这句话的代码; if (!selector) return zepto.Z() 这里的返回值为zepto.Z();那我们继续往上找zepto.Z()函数 zepto.Z function(dom…

置信区间估计 预测区间估计_估计,预测和预测

置信区间估计 预测区间估计Estimation implies finding the optimal parameter using historical data whereas prediction uses the data to compute the random value of the unseen data.估计意味着使用历史数据找到最佳参数&#xff0c;而预测则使用该数据来计算未见数据的…

鸿蒙系统还会推出吗,华为明年所有自研设备都升级鸿蒙系统,还会推出基于鸿蒙系统的新机...

不负期许&#xff0c;华为鸿蒙OS手机版如期而至。今日(12月15日)&#xff0c;鸿蒙OS 2.0手机开发者Beta版本正式上线&#xff0c;支持运行安卓应用&#xff0c;P40、Mate 30系列可申请公测。国内媒体报道称&#xff0c;华为消费者业务软件部副总裁杨海松表示&#xff0c;按照目…

C#中将DLL文件打包到EXE文件

1&#xff1a;在工程目录增加dll目录&#xff0c;然后将dll文件复制到此目录&#xff0c;例如&#xff1a; 2&#xff1a;增加引用&#xff0c;定位到工程的dll目录&#xff0c;选中要增加的dll文件 3&#xff1a;修改dll文件夹下面的dll文件属性 选中嵌入式资源&#xff0c;不…

Oracle VM Virtual Box的安装

安装Oracle VM Virtual Box安装扩展插件 选择"管理""全局设定" 在设置对话框中&#xff0c;选择"扩展" 选择"添加包" 找到"Oracle_VM_VirtualBox_Extension_Pack-4.1.18-78361"&#xff0c;点击"打开" 5&#x…

python 移动平均线_Python中的SMA(短期移动平均线)

python 移动平均线With the evolution of technology rapidly evolving, so do strategies in the stock market. In this post, I’ll go over how I created a SMA(Short Moving Average) strategy.随着技术的飞速发展&#xff0c;股票市场的策略也在不断发展。 在本文中&…

angular中的href=unsafe:我该怎么摆脱你的溺爱!!

解决方法&#xff1a;angular.module加入下面这行&#xff1a;&#xff08;依据Angular changes urls to “unsafe:” in extension page&#xff09; .config(function($compileProvider){//注:有些版本的angularjs为$compileProvider.urlSanitizationWhitelist(/^\s*(https?…

android view gesturedetector,如何在Android中利用 GestureDetector进行手势检测

如何在Android中利用 GestureDetector进行手势检测发布时间&#xff1a;2020-11-26 16:15:21来源&#xff1a;亿速云阅读&#xff1a;92作者&#xff1a;Leah今天就跟大家聊聊有关如何在Android中利用 GestureDetector进行手势检测&#xff0c;可能很多人都不太了解&#xff0c…

Java系列笔记(4) - JVM监控与调优【转】

Java系列笔记(4) - JVM监控与调优【转】 目录 参数设置收集器搭配启动内存分配监控工具和方法调优方法调优实例 光说不练假把式&#xff0c;学习Java GC机制的目的是为了实用&#xff0c;也就是为了在JVM出现问题时分析原因并解决之。通过学习&#xff0c;我觉得JVM监控与调…

地图 c-suite_C-Suite的模型

地图 c-suiteWe’ve all seen a great picture capture an audience of stakeholders.我们所有人都看到了吸引利益相关者听众的美好画面。 Let’s just all notice that the lady in the front right is not captivated by the image on the board (Photo by Christina wocin…

动态链接库.so和静态链接库.a的区别

静态链接库&#xff1a; •扩展名&#xff1a;.a  •编译行为&#xff1a;在编译的时候&#xff0c;将函数库直接整合到执行程序中&#xff08;所以利用静态库编译生成的文档会更大&#xff09; •独立执行的状态&#xff1a;编译成功的可执行文件可以独立运行&#xff0c;不…

华为鸿蒙系统封闭,谷歌正式“除名”华为!“亲儿子”荣耀表示:暂不考虑,鸿蒙OS处境尴尬...

我们都知道&#xff0c;目前智能手机最常用操作系统就是IOS和安卓&#xff0c;占据手机系统超过99%的市场份额。由于IOS系统的封闭性&#xff0c;国内手机厂商基本上都是使用谷歌的开源安卓系统。当然华为也不例外&#xff0c;一直使用的都是安卓系统。可以说&#xff0c;安卓系…

使用vue-cli脚手架搭建简单项目框架

1.首先已经安装了node,最好版本6以上。 2.安装淘宝镜像 大家都知道国内直接使用 npm 的官方镜像是非常慢的&#xff0c;这里推荐使用淘宝 NPM 镜像。这样就可以直接使用cnpm了。 npm install -g cnpm --registryhttps://registry.npm.taobao.org如果过程出差&#xff0c;是否安…

sap中泰国有预扣税设置吗_泰国餐厅密度细分:带有K-means聚类的python

sap中泰国有预扣税设置吗Hi! I am Tung, and this is my first stories for my weekend project. What inspired this project is that I have studied to become data scientist for almost two years now mostly from Youtube, coding sites and of course, Medium ,but my l…

Java—简单的注册页面

根据所提供的界面&#xff0c;编写 register.html 文件 源代码 empty.jsp <% page contentType"text/html;charsetUTF-8" language"java" %> <html> <head><title>error</title> </head> <body> <H1><…

【深度学习系列】用PaddlePaddle和Tensorflow实现经典CNN网络AlexNet

上周我们用PaddlePaddle和Tensorflow实现了图像分类&#xff0c;分别用自己手写的一个简单的CNN网络simple_cnn和LeNet-5的CNN网络识别cifar-10数据集。在上周的实验表现中&#xff0c;经过200次迭代后的LeNet-5的准确率为60%左右&#xff0c;这个结果差强人意&#xff0c;毕竟…

图片获取像素坐标html,HTML5画布Canvas图片抽取、像素信息获取、命中检测

今天主要介绍canvas中比较强大的功能比如将画布内容抽取为图片获取、修改画布的像素信息以及画布的命中检测首先我仍然需要创建画布图片抽取首先要明确的一点是toDataURL()是canvas对象自身的方法而不是环境对象的这个方法会将canvas的内容抽取为一张图片(base64编码)我们来看一…

CentOS6 下Samba服务器的安装与配置

原地址&#xff1a;http://www.cnblogs.com/mchina/archive/2012/12/18/2816717.html 一、简介 Samba是一个能让Linux系统应用Microsoft网络通讯协议的软件&#xff0c;而SMB是Server Message Block的缩写&#xff0c;即为服务器消息块 &#xff0c;SMB主要是作为Microsoft的网…

傅里叶变换 直观_A / B测试的直观模拟

傅里叶变换 直观Many of us have heard, read, or even performed an A/B Test before, which means we have conducted a statistical test at some point. Most of the time, we have worked with data from first or third-party sources and performed these tests with ea…