form表单

表格

<!--基本语法-->
<table>
    <caption>
    标题
    </caption>
    <thead>
    	<tr>
        	<th></th>
        </tr>
    </thead>
	<tbody>
    	<tr>
        	<td></td>
        </tr>
    </tbody>
</table>

<!--
<tr>:    一个tr代表一行
<th>:    内部内容加粗
<td>:    普通内容不加粗
<caption>: 表格标题
<thead>: 表格头
<tbody>: 表格内容
-->


<!--
表格属性
1.border:表格边框宽度
2.cellpadding:内边距
3.cellspacing:外边距
4.width:宽度,最好通过css样式修改长宽
5.rowspan:单元格竖跨多少行
6.colspan:单元格横跨多少列
-->

表单

属性描述
accept-charset规定在被提交表单中使用的字符集(默认:页面字符集)。
action规定向何处提交表单的地址(URL)(提交页面)。
autocomplete规定浏览器应该自动完成表单(默认:开启)。
enctype规定被提交数据的编码(默认:url-encoded)。
method规定在提交表单时所用的 HTTP 方法(默认:GET)。
name规定识别表单的名称(对于 DOM 使用:document.forms.name)。
novalidate规定浏览器不验证表单。
target规定 action 属性中地址的目标(默认:_self)。

form表单除了上述的属性还可以在内部嵌套多个标签

label标签
<!--label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果label标签内点击文本,就会触发此控件。就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。-->	
<!--使用方法-->
<label for="username(指定的标签id)">username:<input type="text" id="username"></label>
textarea标签
<!--可以让用户输入一大段文字-->
<!--使用方法-->
<textarea name="" id="" cols="30" rows="10">
  默认内容
</textarea>
<!--
1.name:名称
2.rows:行数
3.cols:列数
4.disabled:禁用
-->
select
<!--下拉列表,配合option标签一起使用-->
<select name="" id="">
    <optgroup label='一线城市'></optgroup> <!--提示信息-->
    <option value="1">北京</option>
    <option value="2">上海</option>
    <option value="3">广东</option>
    <option value="4">杭州</option>
</select>
<!--
1.multiple:布尔属性,设置后为多选,否则默认单选
2.disabled:禁用,禁止被选择
3.selected:默认初始值
4.value:定义下拉列表的值,获取值得时候一般获取的都是value
-->
input
<!--输入框,也是表单里面最重要的标签,功能十分之多-->
<!--主要是通过修改type属性来修改功能的-->
<!--
type="text" 普通的文本输入框
type="password" 密码输入框
type="date" 日期选择 若要为其设置values需要遵循格式 Y-m-d
type="checkbox" 多选框 多个多选框需要指名同一个name
type="radio" 单选框 多个单选框需要指名同一个name
type="submit" 提交按钮
type="reset" 重置按钮
type="button" 普通按钮
type="hidden"隐藏的输入框
type="file"文件选择
-->

属性
<!--
name:表单提交时的“键”,注意和id的区别
value:
	type="button", "reset", "submit"时,为按钮上显示的文本年内容
	type="text","password","hidden"时,为输入框的初始值
	type="checkbox", "radio", "file",为输入相关联的值
checked:radio和checkbox默认被选中的项
readonly:text和password设置只读
disabled:所有input均适用
-->

<!--能够触发form表单提交的按钮有-->
<button></button>
<input type='submit'>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值