前端HTML常用标签（下篇）

1·8跨行跨列表格（次重点）

colspan 属性设置跨列

rowspan 属性设置跨行

<table width="" height="" align="center" cellspacing="0" border="1">
	<tr>
		<td align="center" colspan="2"><b>1.1</b></td>
		<td align="center" rowspan="2"><b>1.2</b></td>	
	</tr>
	<tr>
		<th>2.1</th>
		<th>2.2</th>
	</tr>
</table>

1·9 了解iframe框架标签（内嵌窗口）

iframe标签可以在页面上开辟一个小区域显示一个独立页面

        iframe和a标签组合使用的步骤：

                1 在iframe标签中使用name属性定义一个名称                

                2 在a标签的target属性上设置iframe的name的属性值

<iframe src="页面地址" width="300" height="400" name="abc"></iframe>
<br/>
<a href="http://www.baidu.com" target="abc">百度</a>

1·10 表单标签（重点）

form标签是表单

        input type="text"                 是文本输入框 value设置默认显示内容

        input type="password"       是密码输入框 value设置默认显示内容

        input type="radio"               是单选框 name可以对其进行分组 checked="checked"表示默认选中

        input type="checkbox"       是复选框 checked="checked"表示默认选中

        input type="reset"               是重置按钮 value属性修改按钮上的文本

        input type="submit"            是提交按钮 value属性修改按钮上的文本

        input type="button"             是按钮 value属性修改按钮上的文本

        input type="file"                   是文件上传域

        input type="hidden"             是隐藏域 不需要给用户看，可以传给后端

value 属性是设置默认值

select 标签是下拉列表框

        option 标签是下拉列表框中的选项 selected="selected"设置默认选项

textarea 表示多行文本输入框（起始标签和结束标签中的内容是默认值）

        rows 属性设置可以显示多行的高度

        cols 属性设置每行可以显示的几个字符宽度

<form>
	用户名称：<input type="text" value="默认值"/><br/>
	用户密码：<input type="password" value="123"><br/>
	性别：	<input type="radio" name="sex" checked="checked"/>男
			<input type="radio" name="sex"/>女<br/>
	情趣爱好：<input type="checkbox" checked="checked"/>java
			<input type="checkbox" checked="checked"/>c++
			<input type="checkbox"/>php<br/>
	国籍：	<select>
				<option>--请选择国籍--</option>
				<option selected="selected">中国</option>
				<option>美国</option>
			</select><br/>
	自我评价：<textarea rows="10" cools="20">输入</textarea><br/>
			<input type="reset" value="重置"/>
			<input type="submit" value="提交"/><br/>
			<input type="file"/>
</form>

1·11 表单提交细节（重点）

form标签是表单

        action 属性设置提交的服务器地址

        method 属性设置提交的方式GET（默认值）或POST

表单提交的时候，数据没有发送给服务器的三个选项情况：

        1、表单没有name属性值

        2、单选、复选（option下拉列表中的标签）都需要添加value属性，一边发送给服务器

        3、表单项不在提交的form标签中

GET请求的特点是：

        1、浏览器地址栏中的地址是：action属性[+?+请求参数]

                请求参数的格式是：name=value&name=value

        2、不安全（显示出数据）

        3、它有数据长度的限制

POST请求的特点是：

        1、浏览器地址栏只有action属性值

        2、相对于GET请求要安全

        3、理论上没有数据长度限制

<form action="" method="POST">
	用户名称：<input type="text" value="默认值"/><br/>
	用户密码：<input type="password" value="123"><br/>
	性别：	<input type="radio" name="sex" checked="checked"/>男
			<input type="radio" name="sex"/>女<br/>
	情趣爱好：<input type="checkbox" checked="checked"/>java
			<input type="checkbox" checked="checked"/>c++
			<input type="checkbox"/>php<br/>
	国籍：	<select>
				<option>--请选择国籍--</option>
				<option selected="selected">中国</option>
				<option>美国</option>
			</select><br/>
	自我评价：<textarea rows="10" cools="20">输入</textarea><br/>
			<input type="reset" value="重置"/>
			<input type="submit" value="提交"/><br/>
			<input type="file"/>
</form>

1·12 其他标签

div标签 独占一行

span标签 它的长度是封装数据的长度

p段落标签 默认在段落上方和下方各空一行（如果已有就不空）

<div>标签1</div>
<div>标签1</div>
<span>标签2</span>
<span>标签2</span>
<p>标签3</p>
<p>标签3</p>