1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > HTML中From表单的常用type属性及用法【较全】

HTML中From表单的常用type属性及用法【较全】

时间:2023-09-03 00:18:59

相关推荐

HTML中From表单的常用type属性及用法【较全】

目录

1.文本框

2.密码框

3.单选按钮 checked

4.复选框 checked

5.列表框 selected

6.按钮

7.文本域

8.文件域

9.自带验证功能 邮箱 网址 数字

10.滑块

11.search搜索框

12.隐藏域

13.只读与禁用

14.标注

15.验证

1.文本框

姓名:<input type="text" name="userName" maxlength="6"/>

2.密码框

密码:<input type="password" name="mima" maxlength="6"/>

3.单选按钮 checked

男<input type="radio" name="sex" value="男"/>

女<input type="radio" name="sex" value="女"/>

一组name值相同,必须指定value值 name=value(sex=男)

4.复选框 checked

<p>

<input type="checkbox" name="hobby" value="music"/>音乐

<input type="checkbox" name="hobby" value="game"/>游戏

<input type="checkbox" name="hobby" value="swim"/>游泳

</p>

name=value 一组name值相同,必须指定value值

5.列表框 selected

<select name="month">

<option value="1">一月</option>

<option value="2">二月</option>

</select> (month=1)

6.按钮

<input type="reset" value="重置"/>

<input type="submit" value="提交"/>

<input type="button" name="弹框" οnclick="alert(this.value)"/>

<input type="image" src="images/login.gif"/> 图片按钮具有提交功能

7.文本域

<textarea name="jieshao" rows="6" cols="30">

</textarea>

8.文件域

<form action="" method="post" enctype="multipart/form-data">

<p>

<input type="file" name="files"/><br/>

<input type="submit" name="upload" value="上传"/>

</p>

</form>

9.自带验证功能 邮箱 网址 数字

邮箱: <input type="email" name="eamil"/>

请输入你的网址: <input type="url" name="userUrl"/>

请输入数字: <input type="number" name="num" min="0" max="10" step="2"/>

10.滑块

请输入数字:<input type="range" name="range1" min="0" max="10" step="2"/>

11.search搜索框

<input type="search"/> 跟text文本框类似

12.隐藏域

<p><input type="hidden" name="id" value="888"/></p>

13.只读与禁用

<P>用户名:<input name="name" type="text" value="张三" readonly></P>

<p><input type="submit" value="修改" disabled/></p>

14.标注

<label for="nan">男</label><input type="radio" name="sex" value="男" id="nan"/>

<label for="nv">女</label><input type="radio" name="sex" value="女" id="nv"/>

15.验证

placeholder required(非空验证) pattern正则表达式

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。