HTML5---03

表单相关标签

	<form action="" method="get">
		账户名：<input type="text" name="username" value=""><br />
		密  码：<input type="password" name="password" value=""><br />
		
        性  别：
		<label>
	        <input type="radio" name="sex" value="0">男
        </label>
        <label>
	        <input type="radio" name="sex" value="1" checked>女
		</label>
        <br />
        爱好：
        <!--<label></label>绑定元素-->
        <label>
        	<input type="checkbox" name="hobby" value="1">篮球
        </label>
        <label>
        	<input type="checkbox" name="hobby" value="2" checked>打游戏
        </label>
        <label>
        	<input type="checkbox" name="hobby" value="3">学习
        </label>
        <br />
        <input type="file" name="file" />
        <br />
        <input type="hidden" name="hidden" value="你好" />
        <input type="image" src="./img/bg.gif" alt="submit" width="66px">
        <br />
        日期选择：
        <input type="date" name="date" />
        <br />
        时间选择：
        <input type="time" name="time" />
        <br />
        第几周选择：
        <input type="week" name="week" />
        <br />
        月份选择：
        <input type="month" name="month" />
        <br />
        完整日期：
        <input type="datetime-local" name="datetime-local">
        <br />

        邮  箱：<input type="email" name="email" value="">
        <br />
        url:
        <input type="url" name="url">
        <br />
        number:
        <br />
        <input type="number" name="number" min="0" max="10">
        <br />
        range:
        <input type="range" name="range" min="0" max="10">
        <br />
        搜索：
        <input type="search" name="search">
        <br />
        颜色：
        <input type="color" name="color">
        <br />
        tel:
        <input type="tel" name="tel">

        <br />
		<input type="submit" name="" value="提交">
		&nbsp;&nbsp;&nbsp;&nbsp;
		<input type="reset" name="" value="清空">
		<br />
		<input type="button" name="" value="普通按钮">
		

	</form>

<form method="get" action=""> 
		请输入文本：
	    <br />
	    <textarea name="mytext" cols="20" rows="5"></textarea>
	    <br />
	    课程：
	    <!--下拉列表和下拉列表的分组-->
	    <select name="course">
	    	<optgroup label="第一组">
	    	    <option>JAVA</option>
	    	    <option selected>Go</option>
	    	</optgroup>
	    	<optgroup label="第二组">
	    	    <option>Python</option>
	    	    <option>C++</option>
	    	</optgroup>
	    </select>
	    <br />

	    <!--将表单的相关元素进行分组-->
	    <fieldset>
	    	<legend>身份信息</legend>
	    	账户名：<input type="text" name="username" value=""><br />
		    密  码：<input type="password" name="password" value=""><br />
		
            性  别：
		    <label>
	            <input type="radio" name="sex" value="0">男
            </label>
            <label>
	            <input type="radio" name="sex" value="1">女
		    </label>
            <br />
	    </fieldset>
	    <!--定义可选数据列表-->
	    <br />
	    搜索：
	    <input type="search" name="search" list="data">
	    <datalist id="data">
	    	<option>你好</option>
	    	<option>大家</option>
	    	<option>大胖</option>
	    	<option>小孩子</option>
	    	<option>小小</option>
	    </datalist>

	    <br /><br />
	    <input type="submit" name="" value="提交">
	</form>

表单相关属性

	 <!--novalidate：取消表单验证，用在form中-->
	 <form action="" method="get">
	    <input type="text" name="" value="123456789" readonly><br />
	    <input type="text" name="" value="123456789" disabled><br />
	    <input type="text" name="" value="" autofocus><br />
	    <input type="text" name="" value="" placeholder="请输入信息"><br />
	    <span style="color: red;">*</span>
	    <input type="text" name="" value="" required><br />
	    <input type="file" name="file"><br />
	    <input type="file" name="file" multiple><br />

	    <input type="text" name="" value="" pattern="[a-z]"><br />
	    <input type="number" name="" min="0" max="12" step="3"> <br />


	    <!--formenctype=""  一般用在文件上传时使用-->
	    <input type="submit" name="" value="提交1" formmethod="post" formnovalidate><br />
	    <input type="submit" name="" value="提交2" formaction="001.html"><br />
	    <br />
	    <input type="text" name="" value="1" tabindex="1"><br />
	    <input type="text" name="" value="3" tabindex="3"><br />
	    <input type="text" name="" value="2" tabindex="2"><br />
	    <input type="text" name="" value="5" tabindex="5"><br />
	    <input type="text" name="" value="4" tabindex="4"><br />

	</form>

HTML框架标签

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>框架标签</title>
</head>
<body>
	<iframe src="002.html" width="300px" height="300px" ></iframe>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
	<title>框架</title>
	<meta charset="utf-8">
</head>
<frameset rows="15%,*">
	<frame src="./top.html"/>
	<frameset cols="10%,*">
		<frame src="./left.html"/>
		<frame src="./index.html"/ name="index">
	</frameset>
</frameset>

</html>