l 用form元素表示表单
l 用action属性表示表单提交地址
l 用method属性表示表单的提交方式
注意:在制作静态页面时,可以不用书写上述的属性
对于静态页面开发者,表单只是一个普通的块盒,内部可以放置任何元素
通常情况下,表单中会放置一些可以与用户进行交互的元素:
l 文本框
l 按钮
l 单选框
l 多选框
l 下拉列表
这些我们常称之为表单元素
表单元素的两个重要属性:
name属性:表示发送到服务器的键名
value属性:表示发送到服务器的值
使用input元素表示一个文本框,input是一个空元素
可通过type属性设置文本框类型。
使用input中的type属性里的submit可以来表示按钮。
<input type=”submit” name=”” value=”提交”>
使用button元素来表示按钮
<button type=”reset”>重置按钮</button>
input与button的比较:
input是空元素,button是普通元素
input按钮中只能写文本,button的内容更加丰富。
input的兼容性更好。
使用select和option元素的组合表示下拉列表。
下来列表的类型:
普通的下拉列表
选项分组的下拉列表
使用datalist元素表达数据列表:
使用textarea元素表达多行文本框:
<textarea cols=”15″ rows=”3″ style=”width:300px;height:50px”>这里内容会在页面显示,包括空格</textarea>
使用fiedset和legend元素,对表单内容进行分组
使用disabled属性和readonly属性,设置表单元素的可用状态。
<fieldset>
<legend>账号信息1233</legend>
<div>
账号:<input type=”text” disabled name=”” value=”kkkk”>
</div>
<div>
昵称:<input type=”text” readonly name=”” id=”” value=”棒棒鸡”>
</div>
</fieldset>
伪类focus:表示聚焦时候的样式。
表单元素的默认样式:
表单元素均默认为行盒,水平排列
表单元素均为可替换元素,可设置盒模型中的各个部分的尺寸
原文链接:https://www.cnblogs.com/boring333/p/11069924.html
原创文章,作者:优速盾-小U,如若转载,请注明出处:https://www.cdnb.net/bbs/archives/33358