前端 第二节 HTML

一、列表

1.有序列表

<ol>
	 <li>第一节</li>
	 <li>第二节</li>
	 <li>第三节</li>
</ol>

• type属性：默认黑圆点
  I: 罗马数字
  A: A,B,C
  a:a,b,c
  1:123
  倒序：style=" " reversed

2.无序列表

<ul>
	 <li>语文</li>
	 <li>数学</li>
	 <li>英语</li>
</ul>

• type属性：默认黑圆点
  square: 实心方块
  circle: 空心圆

3.自定义列表

<dl>
	<dt>第一章</dt>
	    <dd>11111</dd>
	    <dd>22222</dd>
	    <dd>33333</dd>
</dl>

二、表格

<table border="2px" style="text-align: center;">
	<caption>联系人表</caption>
	<tr>
		<th>姓名</th>
		<td>张三</td>
	</tr>
    <tr>
		<th>联系方式</th>
		<td>1234567890</td>
	</tr>
</table>

th表示表格的表头单元格

• 属性
  border：线宽
  style：定义样式 text-align: center;———文本内容居中
  caption：定义表格标题
  rowspan：跨行合并
  colspan：跨列合并

三、表单

		<form action="">
	        <!-- 边框线 -->
	        <fieldset>
	            <legend>信息表</legend>
	            <!-- 文本框text -->
	            <label for="user">用户名</label><input type="text" name="" id="user" placeholder="请输入用户名"><br>
	            <label for="pwd">密&nbsp;&nbsp;&nbsp;码</label><input type="password" name="" id="pwd" placeholder="请输入密码"><br>
	            <!-- 单选按钮radio -->
	            <input type="radio" name="sex" id="nan"><label for="nan">男</label>
	            <input type="radio" name="sex" id="nv"><label for="nv">女</label><br>
	            <!-- 复选按钮checkbox -->
	            <input type="checkbox" name="hobby" id="run"><label for="run">跑步</label>
	            <input type="checkbox" name="hobby" id="Swimming"><label for="Swimming">游泳</label>
	            <input type="checkbox" name="hobby" id="Jump"><label for="Jump">跳绳</label>
	            <input type="checkbox" name="hobby" id="play"><label for="play">打游戏</label><br>
	            <input type="button" value="点击"><br>
	            <!-- 提交按钮submit、标签button -->
	            <button>提交按钮</button><br>
	            <input type="submit" value="提交"><br>
	            <!-- 下拉菜单select（option） -->
	            <select name="" id="">
	                <option value="">北京市</option>
	                <option value="">山西省</option>
	                <option value="">山东省</option>
	                <option value="">河北省</option>
	                <option value="">河南省</option>
	            </select><br>
	            <!-- 点击拖拉range -->
	            <input type="range" name="" id=""><br>
	            <!-- 文本域 标签textarea,style="resize:none;"——禁止文本域拖拽-->
	            <textarea name="" id="" cols="30" rows="10"></textarea><br>
	            <textarea name="" id="" cols="30" rows="10" style="resize: none;"></textarea><br>
	        </fieldset>
    	</form>

内联框架

<!-- 内联框架iframe -->
    	<iframe src="引用地址" height="  px" width="  px"></iframe>