html+css(2)

表单

form元素

在form元素中，有三个重要的属性：

1.action：url统一资源定位符

2.method：提交方式，目前常用的提交方式主要有两种（get/post）

3.enctype：编码方式

表单控件

1.input元素：普通文本框，密码框，单选框，按钮，隐藏域，文件选择框

2.其他元素：标签，文本域，下拉框

1.文本框

<form action method enctype>
    <!-- 文本框：
			value：给文本框设置的值
             maxlength：文本框的最大长度
			readonly：是否只读，默认为true
			placeholder：设置用户提示信息
	-->
    账号：<input type="text" maxlength="12" name="" id="" value="" placeholder="请输入你的账户" /><br>
    密码：<input type="password" maxlength="12" id="" name="" value="" placeholder="请输入你的密码" /><br>
</form>

2.单选框、复选框和文件选择框

<form action method enctype>
    <!--单选框和复选框
			name：单选框和复选框的必须属性，依靠name来实现分组的，一组单选框或者复选框name属性值必须相同
			value：单选框或者是复选框提交到服务器时的实际值
			checked：设置默认被选中
	-->
   性别：<input type="radio" name="sex" checked="checked" />男 <input type="radio" name="sex" />女<br />
   爱好：<input type="checkbox" name="" checked="checked" />basketball <input type="checkbox" name="" />volleyball <input type="checkbox" name="" />football<br>
    <!--文件选择框
	-->
    <input type="file" name="" id="" value="">
</form>

3.下拉列表

<form action method enctype>
    <!--下拉列表
		<select> 元素用来创建下拉列表。是一个表单控件，可用于在表单中接受用户的输入。
         <select> 元素中的 <option> 标签定义了列表中的可用选项。
	-->
   地址：<select>
				<option value="1">陕西省</option>
				<option value="2">山西省</option>
				<option value="3">山东省</option>
				<option value="4">河南省</option>
				<option value="5">甘肃省</option>
				<option value="6">四川省</option>
				<option value="7">重庆省</option>
				<option value="8">湖北省</option>
		</select>
</form>

4.按钮

<form action method enctype>
    <!--按钮
	-->
    <input type="submit" name="" id="" value="登录" style="width: 50px; height: 30px;">
	<input type="reset" name="" id="" value="重置" style="width: 50px; height: 30px;">
</form>

5.文本域与隐藏域

<form action method enctype>
   <!-- 文本域
			rows：指定文本域的行数
			cols：指定文本域的列数
			readonly:是否只读
	-->
    详情：<textarea rows="40" cols="40" readonly="readonly">			 	
            <!--内部填写想要显示给用户的内容-->
		</textarea>
    <!-- 隐藏域
	-->
    <input type="hidden" name="" id="" value="123">
</form>

6.标签

<form>
    <!-- 标签 
		label：关联控件
		for：给定关联控件的id
		说明：在html当中id属性必须是全局唯一的	
    -->
    <label for="rem">选择</label>
    <input type="checkbox" name="" id="rem" value="">
</form>