3HTML5+CSS3
HTML5是唯一一个通吃PC、Mac、iPone、Android等主流平台的跨平台语言。
Html标签<!DOCTYPE html>标签
定义和用法：声明必须是HTML文档的第一行，位于标签之前。注意这个不是html标签，他的意思是指示web浏览器使用哪个HTML版本进行编写的指令。
HTML5新增标签
结构标签
多媒体标签
WEB应用标签
其他标签
结构标签（块状元素）
<article> 标记定义一篇文章
<header> 标记定义一个页面或一个区域的头部
<nav> 标记定义导航链接
<section> 标记定义一块区域。在网页中用途比较大，分成一块一块的
<aside> 标记定义页面内容部分的侧边栏
<hgroup> 标记定义文件中的一个区块的相关信息 里面<h1><h2>
<figure> 标记定义一组媒体内容以及他们的标题
<figcaption> 标签定义figure元素的标题
<footer> 标记定义一个页面或一个区域的底部
注意
header/section/aside/article/footer 不要随意进行嵌套
Header/section/footer > aside/article/figure/hgroup/nav > div 层层嵌套
多媒体标签
<video> 标记定义一个视频 autoplay自动播放 controls进度条控件 loop 循环播放 muted 静音播放 preload预播放 如果使用 "autoplay"，则忽略该属性。
<audio> 标记定义音频内容标记定义一个音频 autoplay自动播放 controls进度条控件 loop 循环播放 muted 静音播放 preload预播放 如果使用 "autoplay"，则忽略该属性。
<source> 标记定义媒体资源
Web应用标签
<meter> （实时状态显示：气压、气温 配合value max min）
<progress> 状态标签（任务过程：安装、加载 配合value max min）
<datalist> 列表标签 (下拉栏 配合option 配合input 配合list使用)
<details> 列表标签 （<summary> 标签包含 details 元素的标题）
<mark> 标签 强调重点的意思
重定义标签
显示不变，只是表达的含义进行了重新定义的标签
<b> 代表内联文本，通常是粗体，没有传递表示重要的意思
<i> 代表内联文本，通常是斜体，没有传递表示重要的意思
<hr> 之前表示一条水平线，现在表示主题结束，而不是简单表示水平线，虽然显示相同。
<small> 表示小字体，例如打印注释或者法律条款，之前一直表示小字体，但这里是和<big>标签成反义
<strong> 表示重要性而不是强调符号
一、CSS3 被划分为各个模块。
其中最重要的 CSS3 模块包括：
选择器
a.基本选择器：
通配符选择器、元素选择器、类选择器、id选择器
b.新增选择器：
群组选择器、伪类选择器、结构伪类选择器
c.伪类选择器：
动态伪类选择器（锚点伪类、用户行为伪类）
锚点伪类
:link,超链接并且未被访问过
:visited，超链接并且已被访问过
用户行为伪类
:hover用户鼠标悬停在链接文本内容上 超链接并且被激活
:active 按下与松开之间的状态
框模型
文本效果
渐变
2D/3D 转换
过渡、动画
二、CSS3结构类
Css3的:nth选择器
我们把css3的:nth选择器也成css3结构类
选择方法
:frist-child、:last-child
:nth-child()、:nth-last-child()、:nth-of-type()、:nth-last-of-type()
:first-of-type、:last-of-type
:only-child、:only-of-typ
:empty
Element:first-child
概念：选择属于其父元素的首个子元素的每个Element元素，并为其设置样式
兼容性：IE8+、firefox、chrome、safari、opera
Element:last-child
概念：指定属于其父元素的最后一个子元素的Element元素样式
Element:nth-child(n)
Element:nth-child(n)
概念：Element:nth-child(n)选择器匹配属于其父元素的第n个子元素，不论元素的类型
Element:nth-of-type(n)
概念：:nth-of-type选择器匹配属于父元素的特定类型的第n个子元素的每个元素
关于参数（n）
Element:nth-child(number)
选择某元素的第number个Element元素
Element:nth-child(n)
N是一个简单表达式，取值”0”开始计算。这里只能是”n”,不能用其他字母代替。
使用公式 (an + b)。描述：表示周期的长度，n 是计数器（从 0 开始），b 是偏移值。3n+0 3倍
Element:nth-child(odd)、Element:nth-child(even)
Odd和even是可用与匹配下标是奇数或偶数的Element元素的关键词（第一个的下标是1）
三、CSS3框模型
css3圆角属性
boder-radius属性
一个最多可指定四个border-radius属性的复合属性，这个属性允许你为元素添加圆角边框。
语法：border-radius:px、%、vw、em
多值
四个值：第一个值为左上角，第二个值为右上角，第三个值为右下角，第四个值为左下角
三个值：第一个值为左上角，第二个值为右上角和左下角，第三个值为右下角
两个值：第一个值为左上角与右下角，第二个值为右上角和左下角
属性
Border-top-left-radius 定义了左上角的弧度
Border-top-right-radius 定义了右上角的弧度
Border-bottom-right-radius 定义了右下角的弧度
Border-bottom-left-radius 定义了左下角的弧度
css3盒模型阴影
box-shadow属性
box-shadow属性可以设置一个或多个下拉阴影的框 阴影框
对象选择器 {box-shadow:X轴偏移量 Y轴偏移量 阴影模糊半径 阴影扩展半径 阴影颜色 投影方式 }
语法
box-shadow:h-shadow v-shadow blur sparead color inset;
兼容性
IE9+、Firefox4+、chrome、safari5+、opera
四、CSS3文本效果
css3文本模型阴影
text-shadow 属性
text-shadow 属性向文本添加一个或多个阴影属性
规定水平阴影、垂直阴影、模糊距离，以及阴影的颜色
语法
text-shadow: h-shadow v-shadow blur color;
css3自动换行
CSS3 word-wrap 属性
word-wrap:break-word;
允许对长单词进行拆分，并换行到下一行
css3渐变:
线性渐变
径向渐变
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
