文本标签
h1 h2 h3 h4 h5 h6
<span></span>
<p></p>
<pre></pre> 预定义标签，里面怎么写的，就怎么展示,里面可以放图片标签
<i></i> 可以被拿来放列表前面的图标
特殊标签
2.滚动标签
<marquee direction='right' scrolldelay='1'>哈喽<img src="images/1.png"/></marquee>
标签属性：
1.滚动方向 direction up down left right
2.滚动延迟时间 scrolldelay（单位是毫秒）
图片标签
<img src="" alt="图片路径不对的提示" title="鼠标悬浮图片上显示">
相关知识点：
链接标签
1.外部超链接
<a href="http://www.baidu.com" target="_blank">百度一下</a>
2.两种空链接
<a href="#"></a>
<a href="javascript:void(0)"></a>
3.通过链接下载文件
<a href="download/001.png" download="download"></a>
4.跳转到顶部（跳底部打锚点）
<a href="#top"></a>
5.设置锚点
能够从一个位置跳转到另一个位置（上下跳转）
单向跳转
开始位置 <a href="#anchor">开始跳转</a>
结束位置 <a id="anchor">页面</a> 或者 <a name="anchor">页面</a> //一般用name
相互跳转
<a href="#chor01" name="chor02">跳转1</a>
<div></div>
<a name="chor01" href="#chor02">跳转2</a>
调转到另一页面
开始位置 <a href='demo.html#o'>开始跳转</a>
结束位置 <a name='o'>页面</a>
小技巧：有href="# "号的地方就是跳转的开始位置，有name=""的是跳转的结束位置
6.打开图片
<a href="imgs/1.png">打开图片</a>
7.打开外部文件
<a href="textdoc/ceshi.txt" target="_blank">打开text文件</a>
<a href="textdoc/第1章.md" target="_blank">打开.md文件</a>
列表标签
<ul><li>无序列表</li></ul>
<ol><li>有序列表</li></ol>
<dl><li>自定义列表</li></dl>
-
无序列表前的样式图标，一般加一个i标签，名字为dot，然后设置css样式。
-
有序列表的属性
reversed 有序列表的倒叙
start 规定有序列表起始值
type 规定有序列表显示类型
表格标签
table标签
<table>
<tr >
<th>标题1</th>
<th>标题2</th>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
</table>
colspan属性 rowspan属性
<table>
<tr >
<th colspan="2">标题1</th>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
</table>
<table>
<tr >
<th rowspan="2">标题1</th>
<th>标题2</th>
</tr>
<tr>
<td>内容2</td>
</tr>
</table>
cellspacing 单元格间距 cellpadding 单元格边距
<table cellpadding="200px" cellspacing="100px" >
<tr >
<th bgcolor="red">标题1</th>
<th>标题2</th>
</tr>
<tr>
<td>内容2</td>
<td>内容2</td>
</tr>
</table>
注意01
如果在设置表格的时候，发现背景有边框为白色，无法取消掉，可能是cellspacing cellpadding未设置为0的缘故，当然也可以使用border-collapse: collapse;边框合并来解决问题。
表单标签
前言知识
动态网页技术：能够实现数据交互的叫动态网页技术。
数据交互：能够去后台交换数据（ajax,php,java,.net等）
静态网页技术：不能实现交互(html,css,javascript等)
javascript是静态网页上面的动态效果
form标签
-
信息收集与提交，提交表单数据到后台，接着数据库会存储提交的信息。
-
登陆信息、注册信息、收集信息、反馈信息、搜索引擎
action='#' 提交数据的地址 //提交到 #当前页面（给个空值） post.html内部页面 http://www.baidu.com外部页面
method="post/get" 表单提交方式
post/get 的区别
- method='post' 向服务器发送数据，安全性高，传输数量大
- method='get' 从服务器获取数据，安全性低，传输数量小
<form action="#" method="post">
</form>
input 标签
1. type="text/password"属性
name="" 表单的名字,提交表单专用，起名尽量语义化
<input type="text" name="userName" >
<input type="password" name="userPassworld">
2. type="radio"属性
单选多选框的默认状态： checked="checked"
<input type="radio" name="sex" value="保密" checked="checked">保密
<input type="radio" name="sex" value="男">男
<input type="radio" name="sex" value="女">女
3. type="checkbox"属性
<input type="checkbox" name="games" value="王者荣耀" checked="checked"/>王者荣耀
<input type="checkbox" name="games" value="使命召唤"/>使命召唤
<input type="checkbox" name="games" value="英雄联盟"/>英雄联盟
<input type="checkbox" name="games" value="绝地求生"/>绝地求生
4. type="submit/button/reset/image" tutton
<input type="submit" value="提交">
<input type="button" value=按钮">
<input type="reset" value="重置">
<button>注册</button>
<input type="image" src="imgs/2.png" title="Google Chrome" alt="图片按钮">
注意：按钮标签，如果里面要加入图片背景，可以将值直接写在input的value里面或者button里面，图片是不会覆盖文字的。
textarea标签
<textarea placeholder="让大家更快地认识你"></textarea>
resize: none;属性能够让文本域宽高无法被设置
select标签
<select name="years">
<option value="2017" style="#aaa">请选择</option>
<option value="2018">2018</option>
<option value="2019">2019</option>
<option value="2020">2020</option>
<option value="2021">2021</option>
<option value="2022">2022</option>
<option value="2023">2023</option>
<option value="2024">2024</option>
</select>
optgroup
<!--optgroup 定义选项组-->
<select>
<optgroup label="年">
<option value="2017">2017</option>
<option value="2018">2018</option>
<option value="2019">2019</option>
<option value="2020">2020</option>
</optgroup>
<optgroup label="月">
<option value="1月">1月</option>
<option value="2月">2月</option>
<option value="3月">3月</option>
<option value="4月">4月</option>
</optgroup>
<optgroup label="日">
<option value="1日">1日</option>
<option value="2日">2日</option>
<option value="3日">3日</option>
<option value="4日">4日</option>
</optgroup>
</select>
detelist 提示列表
<!--提示列表 detelist-->
<input list="aaa" placeholder="请选择你的英雄">
<datalist id="aaa">
<option value="庄周" selected="selected">辅助英雄</option>
<option value="孙尚香">ADC</option>
<option value="亚瑟">战士</option>
<option value="鲁班">射手</option>
</datalist>
布局方式
框架布局
<frameset rows="20%,*">
<frame src="a.html" noresize="noresize">
<frameset cols="20%,60%,20%">
<frame src="b.html" noresize="noresize">
<frame src="c.html" noresize="noresize">
<frame src="c.html" noresize="noresize">
</frameset>
</frameset>
优点： 缺点： 应用场合：
