# html 常见元素
<!--
* @Descripttion:
* @Author: jiegiser
* @Date: 2020-03-19 08:02:36
* @LastEditors: jiegiser
* @LastEditTime: 2020-03-20 08:09:34
-->
<!-- doctype 让浏览器以标准模式渲染，让浏览器知道元素的合法性 -->
<!DOCTYPE html>
<html lang="en">
<head>
<!-- charset页面使用的字符集 -->
<meta charset="UTF-8">
<!-- 视口大小设置 适配移动端的第一步-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 指定基础的路径，所有的链接都是以这个路径为基础进行链接 -->
<base href="/" />
<title>Document</title>
</head>
<body>
<!-- action提交的地址 method提交的方式 enctype编码 -->
<form action="" method="GET" enctype="application/x-www-form-urlencoded"></form>
<table>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>1</td>
<!-- 占据两列-就直接写第三列就可以了 -->
<td colspan="2">2</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<!-- 占据两行 下一行的第一行就不用写了 -->
<td rowspan="2">1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
</tr>
</table>
<p>
<!-- label 的for 跟input的id相同这样点击label的文字就会选中单选-->
<input type="radio" name="radio1" id="radio1">
<label for="radio1">radio1</label>
<input type="radio" name="radio1" id="radio2">
<label for="radio2">radio2</label>
</p>
<!-- 是inline-block元素 对内是block，对外是inline-->
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<a href="">
<div>123123</div>
</a>
<ul>
<li>块级元素可以包含行内元素（p不能包含div）</li>
<li>块级元素不一定能包含块级元素</li>
<li>行内元素一般不能包含块级元素（a元素可以包含div）</li>
</ul>
<p>321123123<div>2eqwewqeqwewqe</div>
</p>
<div>div元素</div>
<ul>
<li>li元素</li>
<li>li元素</li>
</ul>
<!-- 语义化：开发者容易、机器容易理解结构（搜索读屏软件）、有助于SEO -->
<!-- form的好处，直接提交表单，使用submit以reset，便于浏览器保存表单。第三方库可以整体提取值，第三方库可以进行表单验证 -->
</body>
</html>
阅读量：
评 论：
BFC相关 →