第一章
对于尚不完全支持CSS3的浏览器,将引入渐进增强的概念。 渐进增强(Progressive Enhancement):一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验。
优雅降级(Graceful Degradation):一开始就构建站点的完整功能,然后针对浏览器测试和修复。比如一开始使用 CSS3 的特性构建了一个应用,然后逐步针对各大浏览器进行 hack 使其可以在低版本浏览器上正常浏览。
1.css3新特性
a.强大的css3选择器
新增属性选择器、伪类选择器、过滤选择器
b.添加图片视觉效果
圆角(border-radius)、阴影(text-shadow、border-shadow)、渐变背景、半透明、图片边框(border-image)
c.容器变换
tranform: rotate skew scale translate
d.过渡效果
transtion: property duration timing-function delay;
e.动画
animate
keysframe
f.颜色与透明度
rgba
hsl(hue saturation lightness)
hsla(hue saturation lightness alpha)
g.web字体和web font图标
font-face的引入
h.媒体查询与响应式布局
@media的运用
第二章 CSS3选择器
1. 新增选择器
属性选择器
伪类选择器
过滤选择器
2. CSS3选择器分类
a. 基本选择器
b. 层次选择器
c. 伪类选择器(动态伪类选择器、目标伪类选择器、语言伪类选择器、UI元素伪类选择器、结构伪类选择器、否定伪类选择器)
d. 伪元素
e. 属性选择器