前段篇：HTML
<!DOCTYPE html> 文件开头统一的标准！
HTML包含了两部分：
head与body 固定的格式。
一、head部分：
head部分分为两部分：meta标签与非meta标签：
编码、跳转、刷新、关键字、描述、兼容性
1.1 meta标签：
meta有两个属性：name与http-equiv
<meta charset="utf-8"> 设置编码
name属性：
<meta name="keywords" content="meta总结,html meta,meta属性,meta跳转"> <meta name="description" content="老男孩培训机构是由一个很老的男孩创建的">
http-equiv属性：
刷新与跳转：<meta http-equiv="refresh" content="3;http://www.baidu.com">
1.2 非meta标签：
<title>oldboy</title> 搞标题
<link rel="icon" href="http://www.jd.com/favicon.ico"> 搞图标
<link rel="stylesheet" href="css.css"> ？
<script src="hello.js"></script> ？
二、BODY标签
2.1基本标签(块级标签，行内标签)
所有的标签都分为：块级标签与内联标签（行内标签） 可以使用谷歌浏览器的开发者来查看，属于哪一种标签。
特殊字符与图标： 空格  > < © 其他查询的时候看
<p><p> 段落标签，段落之间存在间隔
<br> 换行
<h1></h1> h1-h6之间，加大加粗
<span></span> 是一个白板标签，让css让控制具有变成任何标签的能力
<hr> 下划线
<div> 也是一个白板标签
标签：最重要的作用就是定位
2.2 form表单
浏览器与服务器通讯，传输我们的填入的数据，就是使用form表单： form表单中，有 input，textarea，select三个 这是最最最重要的，其他的都是定义界面位置
form的属性： name在form表单中是必须的，name是发给服务器的键，服务端就是根据name的键来操作数据！
- action： 表单的提交地址
- method：请求方式 get,post----------->两者其实没区别，安全性都一样 只是get把数据加载url中，post是吧数据放在请求体中。
input系列：
input type='text' -name属性，value='赵凡'(默认显示的数值)
input type='password' -name属性
input type='submit' -value 按钮上面的数值
input type='radio' -单选框 value,name属性(name相同,则互斥) cheked="checked"默认被勾选
input type='checkbox' -多选框 value,name属性(批量获取属性)
input type='file' -依赖form表单的属性enctype="multipart/form-data"
input type='reset' -重置整个表单到默认的值
input type='botton' -按钮，在学js的时候，会加入
textarea:多行文本
<textarea name="text" rows="10" cols="10">默认文字</textarea>
select：下拉选择框，name在select中定义，value在option中定义：
- select->name
- option->value
- selected="selected";
- size="10"显示多个
- multiple="multiple" 多选按住shift
- optiongrop 分组但是不能选中
<select name="city1" size="5"> <option value="1">河南省</option> <option value="2">北京省</option> <option value="3">北京省</option> <option value="4">北京省</option> <option value="5">北京省</option> </select> <select name="city2" multiple="multiple" size="2"> <optgroup label="北京"> <option value="1">河南省</option> <option value="2">北京省</option> </optgroup> </select>
三、a标签
两个作用1.跳转 2.锚
3.1跳转使用
target参数是打开新页面的方式
<a href="http:\\www.baidu.com" target="_blank">百度</a>
3.2锚使用
<a href="#某个标签的id"> id不能重复
<a href="#1">第1章</a> <a href="#2">第2章</a> <a href="#3">第3章</a> <a href="#4">第4章</a> <div id="1" style="height: 500px;">第一章</div> <div id="2" style="height: 500px;">第2章</div> <div id="3" style="height: 500px;">第3章</div> <div id="4" style="height: 500px;">第4章</div>
四、图片标签
<a href="http://www.baidu.com"> <img src="1.jpg" height="100" title="大美女" alt="图片不显示的时候出现"> </a>
五、列表与表格
列表我们一般都是使用css去改造我们想要的。
1 <ol> 2 <li>were</li> 3 <li>12qeq3</li> 4 <li>12eqeq3</li> 5 <li>1eqeq3</li> 6 </ol> 7 <ul> 8 <li>12wedw</li> 9 <li>12wedw</li> 10 <li>12wedw</li> 11 <li>12wedw</li> 12 </ul> 13 <dl> 14 <dt>ttt</dt> 15 <dd>dddd</dd> 16 <dd>dddd</dd> 17 <dd>dddd</dd> 18 <dt>ttt</dt> 19 <dd>dddd</dd> 20 <dd>dddd</dd> 21 <dd>dddd</dd> 22 <dt>123</dt> 23 <dd>dddd</dd> 24 <dd>dddd</dd> 25 <dd>dddd</dd> 26 </dl>
表格
<table border="1"> <thead> <tr> <th>主机</th> <th>端口</th> <th>操作</th> </tr> </thead> <tbody> <tr> <td>1</td> <td colspan="2">1</td> </tr> <tr> <td>1</td> <td rowspan="3">1</td> <td>1</td> </tr> <tr> <td>1</td> <td>1</td> </tr> <tr> <td>1</td> <td>1</td> </tr> </tbody> </table>
六、小特性：
fileset 与lable
1.文字被框围绕
2.点击文本，光标自动进入文本框：通过lable for id来实现
<fieldset> <legend>帅炸了</legend> <label for="id1">姓名：</label> <input id="id1" type="text"> <br/> <label for="id2"> 密码：</label> <input id="id2" type="text"> </fieldset>
