习题1：CSS3
CSS3是CSS词汇的新一代版，意在扩充CSS2.1，它减少了很多新优点与捷伊产业布局形式。
为的是大力推进这些早已证实没难题的优点的技术国际标准速率，CSS3分割了一连串互相分立的组件，依照各别进度来展开技术国际标准。因而那时国际标准CSS主要包括修改后的CSS2.1和完备组件对它的扩充，组件的level数并不完全一致。W3C会不定期正式发布snapshots（镜像），列举CSS2.1和成形的组件。
有的是CSS组件已经极为平衡，采用时也无须加进后缀，其状况为CSSWG明确规定的四个所推荐官品众所周知：备选所推荐、提议所推荐或所推荐。不平衡的优点应以应用领域程序发动机为后缀并慎重采用。
习题2：色调组件Level3
1.减少opacity属性，用作选定原素有效性，需为0.0~1.0。被应用领域原素和其父原素会被当做两个总体审视，具备完全相同有效性，即使子原素有相同opacity值；
2.可采用hsl()、hsla()、rgba()、rgb()来创建color值；
3.transparent色调现阶段是R520所以是rgba(0, 0, 0, 0.0)的别称。
习题3：示例Level3
1.减少子树相匹配的特性示例，E[attribute^=”value”]，E[attribute$=”value”]，E[attribute*=”value”]；
2.减少捷伊regardless，如:enabled，:disabled，:checked，:nth-child，:nth-of-type，:empty，:not等；
3.伪原素采用两个冒号而不是两个冒号来表示；
4.捷伊普通兄弟示例~，用作选择“某原素后所有同级的选定原素”。
习题4：媒体查询
采用@media媒体查询，可以针对相同的设备定义相同的样式。其包含两个可选的媒体类型和零或多个媒体优点表达式（表达式要用括号），语法为：@media mediatype and|not|only (media feature) {CSS-Code;}，也可以在link中采用media=”mediatype and|not|only (media feature)”特性来针对相同媒体采用相同样式表。
可以采用not（对整个媒体查询取反）、and（同时满足）和only（防止老旧的应用领域程序不支持带媒体特性的查询而应用领域到给定的样式）来构建复杂的媒体查询。若采用了not或only则必须选定两个媒体类型。也可以将多个媒体查询以逗号分隔放在一起，相当于or。
常见媒体查询有：
//宽高比为16:9或者16:10的宽屏设备
@media screen and (device-aspect-ratio: 16/9), screen and (device-aspect-ratio: 16/10) { CSS-Code }
//向显示在设备最大宽度800px的屏幕上的文档应用领域样式表
<link rel=”stylesheet” media=”screen and (max-device-width: 800px)” />
//设备处于竖屏模式
@media all and (orientation: portrait) { CSS-Code }
//可视区域的宽度在500到800px之间的屏幕
@media screen and (min-width: 500px) and (max-width: 800px) { CSS-Code }
习题5：背景与边框组件Level3
1.支持多背景图片，例：background-image:url(bg_flower.gif),url(bg_flower_2.gif);
2.新增特性background-size明确规定背景图片的尺寸，例：background-size:63px 100px;
3.新增特性background-origin明确规定背景图片的定位区域，例：
background-origin:content-box;4.支持圆角边框：border-radius，该特性是两个简写特性，也可分别设置四个特性：border-top-left-radius、border-top-right-radius、
border-bottom-right-radius、border-bottom-left-radius。例：border-radius:25px;5.支持图片建立边框：border-image，该特性是两个简写特性，用作设置border-image-source图片路径、border-image-slice图片边框向内偏移、border-image-width图片边框宽度、border-image-outset图像区域超出边框的量、border-image-repeat是否平铺铺满或拉伸。例：border-image:url(border.png) 30 30 round;
6.支持原素阴影：box-shadow。例：box-shadow: 10px 10px 5px #888888;前两个值必须，为水平阴影与垂直阴影的位置。
习题6：值和单位组件Level3
1.initial（最初值）和inherit（从父原素继承值）关键字能被用作任意CSS特性中；
2.定义了捷伊相对字体长度单位：rem和ch。rem相对于html的font-size，而1ch=1英文=1数字=0.5汉字。
3.定义了相对视口长度单位：vm，vh，vmax和vmin。vw为可视区域宽度，总宽度为100vw，vh为可视区域高度，总高度100vh，vmin在可视区域宽度和高度取小，vmax则取大。
习题7 . 盒模型
7.01 、盒子模型的概念
所谓盒子模型就是把HTML页面中的原素看作是两个矩形的盒子，也就是两个盛装内容的容器。每个矩形都由原素的内容，内边距(padding)，边框(border)和外边距(margin)组成。
a、网页就是多个盒子嵌套排列的结果
b、内边距出那时内容区域的周围，当给原素加进背景色或背景图像时，该原素的背景色或背景图像也将出那时内边距中
c、外边距是该原素与相邻原素之间的距离
d、如果给原素定义边框特性，边框将出那时内边距和外边距之间
注意:虽然盒子模型拥有内边距，边框，外边框，宽和高这些基本特性，但是并不是要求每个原素都必须定义这些特性。
2 . 边框特性
border：设置原素的边框（width stylecolor）/四边宽度，四边样式，四边色调
border-width：设置原素边框的宽度、像素值
border-style：设置原素边框的样式 none：无(默认)/solid(单实线)/dashed(虚线)/dotted(点线)/double(双实线)
border-color：设置原素边框的色调
7.01、单独设置原素上边框
border-top ：宽度/样式/色调
border-top-width ：宽度
border-top-style ：样式
border-top-color：色调
7.02、单独设置原素右边框
border-right：宽度/样式/色调
border-right-width：宽度 border-right-style：样式 border-right-color：色调
7.03、单独设置原素的下边框
border-bottom：宽度/样式/色调
border-bottom-width：宽度
border-bottom-style：样式
border-bottom-color：色调
7.04、单独设置原素的左边框
border-left：宽度/样式/色调
border-left-width：宽度
border-left-style：样式
border-left-color：色调
7.05、综合设置边框
像border，border-top等这样，能够两个特性定义原素的多种样式，在CSS中称之为复合特性。
常用的复合特性有font、border、margin、padding和background等。
复合特性可以简化代码，提高页面的允许速率，但是如果只有一项值，最好不要用复合特性，以免样式不被兼容。
Tips:
a. 表单的边框通常改为0;
Border：0 none；//兼容所有应用领域程序
b. 表格的细线边框
Table{border-collapse：collapse；}
c. 轮廓(链接有虚线和文本框有蓝色边框)
Outline-style：none；
Padding特性用作设置内边距,也是复合特性,相关设置如下:
Padding-top：上内边距
Padding-right：右内边距
Padding-bottom：下内边距
Padding-left：左内边距
Padding：上内边距、右内边距、下内边距 、左内边距
内边距是享有背景色的
7.06、外边距特性
Margin特性用作设置外边框,也是复合特性,相关设置如下：
Margin-top：上外边距
Margin-right：右外边距
Margin-bottom：下外边距
Margin-left：左外边距
Margin：上外边距/右外边距/下外边距/左外边距
Margin相关特性的值，和符合特性margin取1~4个值得情况与padding完全相同
外边距可以采用负值，使相邻原素重叠
对块原素应用领域宽度特性width，并将左右的外边距都设置为auto，可使块级原素水平居中，实际工作中常用这种形式展开网页产业布局,实例代码如下：
.header{width:960px;margin:0 auto};
为的是更方便地控制网页中的原素，制作网页时，可采用如下代码清除元素的默认内外边距：
*{padding:0 /*清除内边距*/
Margin:0; /*清除外边距*/}
