众所周知，Bootstrap 最大的特性是自适应，不是那么众所周知的，Bootstrap 自适应的原理是媒体查询，问题来了：什么是媒体查询？
在今天之前，我对这个问题是模模糊糊，在今天之后，我猜我肯定一直可以记住了。
一句话说明，什么是媒体查询：
媒体是设备载体，查询那就是查询当前属于那种设备，目的是让网页在不同的设备上面可以正常加载。
下面就在详细的拆解一下这个知识点。
- 媒体查询主要查询的是那些属性？
width、height、max-width / max-height 、min-width / min-width 、orientation: portrait (竖屏模式) | landscape (横屏模式)。
- 它是怎么查询到这些条件的。
这个时候就引入一个关键单词，media，不过我更觉得它像是一种语法，判断当前设备是否符合期望值，判断条件的关键字有： and、not、only。
- 查询到这些不同条件后，它是怎么引入样式的？
与 CSS 差不多，或者就是 CSS 吧，有内联和外联两种引入方式。
内联举例：
@media only screen and (width: 320px) and (height: 568px) {}
外联举例：
<link rel="stylesheet" type="text/css" href="01.css" media="only screen and (max-width: 420px)">
CSS的媒体查询.png
