没啥关系吧。
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。
CSS是一种定义样式结构如字体、颜色、位置等的语言，被用于描述网页上的信息格式化和显示的方式。CSS样式可以直接存储于HTML网页或者单独的样式单文件。无论哪一种方式，样式单包含将样式应用到指定类型的元素的规则。
外部使用时，样式单规则被放置在一个带有文件扩展名_css的外部样式单文档中。
样式规则是可应用于网页中元素，如文本段落或链接的格式化指令。样式规则由一个或多个样式属性及其值组成。内部样式单直接放在网页中，外部样式单保存在独立的文档中，网页通过一个特殊标签链接外部样式单。
名称CSS中的“层叠（cascading）”表示样式单规则应用于HTML文档元素的方式。具体地说，CSS样式单中的样式形成一个层次结构，更具体的样式覆盖通用样式。样式规则的优先级由CSS根据这个层次结构决定，从而实现级联效果。
这是通过css-级联样式表的设计。这意味着，如果应用两个与相同元素发生冲突的规则，它将选择最后一个声明的规则，除非第一个规则具有!important标记或更具体(例如：html >body相对于只是body，后者不那么具体)。
所以，考虑到这个CSS
@media (max-width: 600px) {
body {
background: red
}}@media (max-width: 400px) {
body {
background: blue
}}
如果浏览器窗口宽为350像素，则背景将是蓝色的，而使用此css则是蓝色的。
@media (max-width: 400px) {
body {
background: blue
}}@media (max-width: 600px) {
body {
background: red
}}
和相同的窗口宽度，背景将是红色的。这两条规则确实是匹配的，但第二条规则是应用的规则，因为这是最后一条规则。
最后，用
@media (max-width: 400px) {
body {
background: blue !important
}}@media (max-width: 600px) {
body {
background: red
}}
或
@media (max-width: 400px) {
html >body {
background: blue
}}@media (max-width: 600px) {
body {
background: red
}}
背景将是蓝色的(350像素宽的窗口)。
