html常用的标签

前端学习的第二天

1. 块标签 block 占满一行

块标签	功能
h1	标题1
h2	标题2
h3	标题3
h4	标题4
h5	标题5
h6	标题6
p	段落
div	块元素
hr	横线

2. 内联标签 inline 从左到右排列

内联标签	功能
span	纯行内 方便查找
strong	加粗
u	下换线
em	斜体
font	改字体样式

3. 自定义列表

<dl>
	<dt>自定义列表标题</dt>
	<dd>自定义列表内容</dd>
</dl>

4. 有序列表

<ol type="i">
	<li>列表1</li>
	<li>列表2</li>
</ol>

5. 无序列表

<ul type="square">
	<li>列表1</li>
	<li>列表2</li>
</ul>

6. 直接使用标签

<li>列表1</li>
<li>列表2</li>

7. 超链接标签
   1. <a href=""></a>
   2. a标签路径规则:
   3. ./表示当前目录; /表示根目录;
   4. 还有锚点的功能#为回到顶部 #id 回到指定位置
   5. target=“blank”;为使用新的标签打开网页
   6. 内容除文字外还可放图片
8. 图片标签
   <img src="地址" alt = "名称" >
9. 表格标签

标签	功能
table	表格
tr	行
td	单元格
thead	划分表格区域
tbody	划分表格区域
tfoot	划分表格区域

属性	功能
rowspan	跨行合并
colspan	跨列合并

	<table border="1">
			<caption>文档</caption>
			<tr>
				<th>标题1</th>
				<th>段落1</th>
				<th>格式1</th>
			</tr>
			<tr>
				<td>标题2</td>
				<td>段落2</td>
				<td>格式2</td>
			</tr>
	</table>

10. 表单标签
    form标签 功能是收集用户信息
    action属性 指定数据发送的地址
    method 数据发送的方式
    表单要有输入框和提交按钮

	    <form action="" method="get">
			<input type="text" name="MyName" placeholder="输入提示" maxlength="5" value="abc" readonly="readonly"/><br />
			<input type="password" /><br />
			性别<input type="radio" name="gen" value="1"/> 男<input type="radio" name="gen" value="0" checked="checked" />女<br />
			兴趣<input type="checkbox" name="h" value="1" checked="checked" /> 游泳
			    <input type="checkbox" name="h" value="2" checked="checked" /> 游戏
			    <input type="checkbox" name="h" value="3" checked="checked" /> 爬山
				<br />
				<input type="date" /><br />
				<input type="number" /><br />
				<input type="color" /><br />
				<input type="email" /><br />
			<select name="num">
				<option value="1">1</option>
				<option value="2">2</option>
				<option value="3">3</option>
			</select><br />
			<textarea cols="8" rows="8"></textarea><br />
				<input type="button" value="我的按钮" />
				<input type="reset" value="重置" />
			<input type="submit" value="提交" />
		</form>