html的定义：
1.超文件标记言语
2.用来描述网页的一种语言
3.一种标记语言（不是编程语言）Hyper Text Markup Language
html 5 支持的浏览器：IE9+、谷歌、火狐、Opera、Safari
浏览器内核：
Trident（Avant、腾讯TT、Netscape 8）
Gecko（Firefox、Netscape6至9）
WebKit（Safari和Google的浏览器Chrome）
Presto（它取代了旧版Opera 4至6版本使用的Elektra排版引擎，包括加入动态功能，例如网页或其部分可随着DOM及Script语法的事件而重新排版）
html文档声明和注释:
文档声明：<!DOCTYPE html>
注释：
结构标签：html、head、body
head 头部标签：
title：网页标签
meta：
属性：name、http-euiv、charset、content
实例：
设置网页编码：<metacharset="utf-8"/>
<metahttp-uquiv="content-type"content="text/html;charset=utf-8"/>
刷新页面和跳转：
<metahttp-equiv="refresh"content="2;url=http://www.baidu.com"/>
关键字：<meta name="Keywords"content="关键字" />
描述： <meta name="Description" content="简介、描述" />
<meta name="author"content="作者“/>
link：导入外部CSS样式文件<link href="css/css.css"rel="stylesheet" type="text/css">
script：1.导入外部脚本文件2.在内部定义脚本
style：在内部定义CSS样式
html 文本与文本格式：
html文本标签：p 定义段落、b 定义加粗、strong 强调加粗、i 定义斜体、em 强调斜体、cite 引用斜体、hn h1-h6 定义标题 加粗 放大 自动换行、sub 下标文字、sup 上标文字
html本文格式标签:1.bdo dir属性定义文本方向
2.q 定义引用 添加双引号“”
3.abbr 定义缩写 title属性指定全写
4.del 定义删除文字 中划线
5.time 定义时间 datetime属性指定具体时间 html5新标签、
6.summary 定义details的标题 html5
7.details 定义细节 smmary定义其标题 html5
8.dialog 定义对话 dt dd html5
实体标签:
⁢ <
> >
空号
&puot; ""
© 版权符号
× x
列表标签：
1.ul 定义无序列表
2.li 定义列表选项
3.ol 定义有序列表
4.dl,dt(标题),dd(内容) 定义定义列表
5.pre 预格式化输出
6br 换行
表格标签（1）：
<table 属性=" "...>
<tr>
<th></th>//列（标题）
</tr>
<tr>
<td></td>//行（内容）
</tr>
</table>
表格标签（2）：
<table border="1"(边框的值) cellpadding="0"(清除单元格的默认样式) cespacing="0"(指单元格的间距)>
<thead>-----> 表头
<tr>------> 表头行
<th></th>-->表头列
</tr>
</thead>------> 表头
<tbody>------> 表身
<tr>-------> 表身行
<td></td>----> 表身列
</tr>
</tbody>-------> 表身
<tfoot>--------> 表尾
<tr>--------> 表尾行
<td></td>----> 表尾列
</tr>
</tfoot>---------> 表尾
</table>
注：表格中的三个类别里，表头和表尾可以省略不写，但是表身必须要有。
1:border-collapse：collapse；取消间距
2:colspan="3" 行的单元格合并
3:rowspan="2" 列的单元格合并
注：如果没有内容的话单元格要给高度和宽度。（因为不设置宽高的话单元格是根据内容撑开）同理ul,ol,dl那些差不多，按照我个人习惯，只要是个盒子的我基本都会给他一个宽高因为这样不容易出BUG！
FROM表单：
密码框:密码:<input type="password" name="password"/>
文件上传:头像:<input type="file" name="header" />
自动获取焦点:<input type="text" autofocus required/>
搜索功能:搜索:<input type="search" results required/>
数值:验证是否数字：<input type="number" name="sz"/>
验证邮箱:验证邮箱：<input type="emali" name="yx" autocomplete="on"/>
复选框:<input type="checkbox" name="">
单选框:<input type="radio" name="">
下拉列表:<select name=""> <option value="">XX</option></select>
文本域:<textarea row(行)="X" cols（列）="X">
按钮:<input type="button" value="Hello word">
围绕的数据:
<fieldset>
<legend>健康信息</legend>
身高：<input type="text" />
体重：<input type="text" />
</fieldset>
提交表单:<input type="submit" value="Submit">
A 链接标签：
超链接:a 指定href
锚点:1.a 指定name 其他元素指定锚点 2.URL ：http://www.baidu.com/index.php#mao
mailto:href="mailto:邮箱地址"
路径地址:1.相对地址 2.绝对地址
多媒体标签：
img(导入图片)属性： src、width、height、border、usemap
map：把image分成不同区域、属性 name指定map名字
area：把image区域的具体形状
audio（导入音乐）属性：src、controls、autoplay
viedo（导入视频）属性：src、controls、autoplay、poster、loop
source（导入视频嵌套在viedo使用）：src
mebed（导入资源 视频 音频）：src
CSS：之前和大家说过CSS就是网页的衣服和鞋子（可以使网页排版更好看）下面就给大家列举用得比较多的CSS属性。
字体属性：
font-size
font-family
font-style:normal（正常 默认)、italic（斜体）、oblique（斜体）
font-weigth：normal（默认）、bold（粗）、bolder（更粗）、lighter（细）、100=900（数值）
文本属性：
字母间距letter-spacing
单词间距word-spacing
text-decoration:overline（上划线）underline（下划线）line-through（删除线）none（没效果）
text-align:left right center文本居中 补充：margin:0 auto盒子居中
text-indent:将段落的第一行缩进 X像素
line-height
word-wrap(CSS3):normal break-word(允许长单词换行到下一行)
text-transform：none capitalize（首字母大写） uppercase(大写） lowercase（小写）
cursor 属性规定要显示的光标的类型（形状）
背景属性
background-color:
background-image:background-image:url()
background-repeat:repeat(默认） on-repeat repeat repeat-x repeat-y
background-position:left/right/center/number px top/center/bottom.number px
background-attachment:scoll fixed(设置背景图像是固定还是会跟着移动)
background:background:color/image/repeat/position/attachment
补充：
background-size(规定背景图像的尺寸):
background:rgba(255,255,255,.8)//255,255,255代表颜色 .8代表背景透明度
background:-webkit-linear-gradient(top/bottom/left/bottom,rgba(0,0,0,.0),rgba(0,0,0,1));
颜色渐变
background:url(../images/sprite.png) no-repeat(图片不平铺) px(水平距离x) px（垂直距离y）;背景共用一张图片减少空间提高效率（淘宝，VIP都会用到的小图）
边框属性:
border-style:none dotted dashed solid double groove ridge inset outset
border-color
border-top、border-bottom、border-left、border-right
列表属性:
list-style-type
list-style-image
list-style-position:inside outside
list-style
内补白\外补白
padding\margin-left
padding\margin-right
padding\margin-top
padding\margin-bottom
padding\margin:四个边
padding\margin:上下 左右
padding\margin:上 左右 下
padding\margin:上 右 下 左
布局：
display：lnline（行内元素) block(块状元素）inline-block none
visitility：visitable invisitable hidden
overflow：
overflow-x：（hidden）是否对内容的左/右边缘进行裁剪
overflow-y：（hidden）是否对内容的上/下边缘进行裁剪
float（浮动）：none left right
clear（清除）：both left right
定位：
position:relative absolute fixed
left
right
top
bottom
z-index:层叠数值越大就在最上面
CSS选择器
常用选择器：
1.*通用选择器 *{margin:0,padding:0;}
2.元素选择器（如p,div,html,body等等）
3.ID选择器，id="XX" #id(调用)
4.CLASS类选择器，class="XX" .XX（调用）
5.属性选择器，（在不带有CLASS或者ID时可考虑用属性选择器）（只影响特定的那一行）；标签[元素="目标/数值"] {样式}
6.后代选择器S1 S2{ } DIV P{}
7.子代选择器S1>S2{ } UL>LI{}
8.子元素选择器：
：first-child选择元素的第一个
：last-child选择元素的最后一个
：nth-child() 这个是相对于父元素的
：nth-of-type()这个无论如何都是相对于第一个元素的
伪类选择器:
常用伪类选择器 标签 ：hover 当鼠标悬停在其标签上时显示其样式
如：.navblock:hover .topnav-2th{
display:block;
}
选择器顺序
1.内联式样式表>ID选择器>(CLASS)类选择器>元素选择器>*通配符选择器（最低顺序）
2.在同一组属性设置中标有"!important"则优先级最大
如：color:#00f !important;/优先级最大/
