交集选择器与并集选择器：
在企业开发中都不怎么经常用。
1.
交集选择器：格式中标签与标签之间没用任何东西，
交集选择器选择出符合和满足各个标签属性的标签：如：标签1标签2标签3{属性：值；} 最终找到同时满足标签1，标签2，标签3的标签。
2.
并集选择器：格式中中，分隔开。格式：标签1，标签2{属性：值；}
并集选择器是用来找出所有的满足和符合标签1或标签2的标签。如：标签2，标签2，标签3{ 属性：值；}，最终系统找出所有的 满足标签1或标签2或标签3的标签。满足标签1的标签数量+满足标签2的标签数量+满足标签3的标签数量=系统选出的标签数量。
交集选择器：
数学中：
区域一和区域二共同拥有的部分为区域三，则区域三就为区域一和区域二的交集。
css中：
标签一和标签二相同的部分就为交集选择器。系统所找到的标签必须满足：既有标签一的特点，也有标签二的特点。
<style>
标签一标签二{
属性：值；
}
</style>
系统找到的标签为：
1、<标签一 id="标签二">
或 2、<标签一 class="标签二">
或 3、<标签 id="标签一" class="标签二">
格式：
标签1标签2{
属性;值;
}
标签1与标签2之间什么也没有。
特例：
标签1标签2标签3{
color:red;
}
先找到所有的标签1代码，再从所有的标签1代码中找到所有的符合标签2特性的标签代码，再从所有的既符合标签1又符合标签2的标签中找到所有再次符合标签3的标签代码。
（也就是最后找到的标签里面的属性：标签1、标签2、标签3、标签4的特性都要符合，标签1是标签名，标签2是id名，标签3是class名，那么最后的标签就为：<标签1 id="标签2" class="标签3"></标签1>）
并集选择器
数学中：
区域一与区域二并在一起就是区域三。（区域一+区域二=区域三）
css中：
并集选择器就是选择所有的满足标签1，或者满足标签2的标签，然后对其进行修饰。
格式：
标签1,标签2{
属性:值;
}
（标签1与标签2使用，分开的）
意思是：系统先找到所有的标签1，再找到所有的标签2，然后将所有的标签1和标签2集中做修饰。
CSS 盒子模型(Box Model)
所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。
CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。
盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。
下面的图片说明了盒子模型(Box Model)：
不同部分的说明：
- Margin(外边距) - 清除边框外的区域，外边距是透明的。
- Border(边框) - 围绕在内边距和内容外的边框。
- Padding(内边距) - 清除内容周围的区域，内边距是透明的。
- Content(内容) - 盒子的内容，显示文本和图像。
为了正确设置元素在所有浏览器中的宽度和高度，你需要知道的盒模型是如何工作的。
元素的宽度和高度
重要: 当您指定一个CSS元素的宽度和高度属性时，你只是设置内容区域的宽度和高度。要知道，完全大小的元素，你还必须添加填充，边框和边距。.
下面的例子中的元素的总宽度为300px：
实例
div {
width: 300px;
border: 25px solid green;
padding: 25px;
margin: 25px;
}让我们自己算算：
300px (宽)
+ 50px (左 + 右填充)
+ 50px (左 + 右边框)
+ 50px (左 + 右边距)
= 450px
试想一下，你只有250像素的空间。让我们设置总宽度为250像素的元素:
实例
div {
width: 220px;
padding: 10px;
border: 5px solid gray;
margin: 0;
}最终元素的总宽度计算公式是这样的：
总元素的宽度=宽度+左填充+右填充+左边框+右边框+左边距+右边距
元素的总高度最终计算公式是这样的：
总元素的高度=高度+顶部填充+底部填充+上边框+下边框+上边距+下边距