CONTENT OF TABLE
01首先
bootstrap中，container容器是一個基本的概念，剛開始看的時候，有一點模糊。不知道為啥要區分這么多。所以，在理解后，發現其實非常簡單，這里對其進行一個簡單的總結。
bootstrap的文檔提供了這樣一個表格：
干什么用的呢？
其實就是指定一個容器，在到達不同的指定寬度之前，始終保持100%的寬度。bootstrap中把這個指定的寬度，叫做斷點（breakpoint）。
其實，就是min-width。
02.container和.container-fluid
.container
bootstrap中，首先引出.container和.container-fluid這兩個常用的class定義。
.container指定了，在容器的寬度，小於576px的時候，始終保持100%的寬度，
但是如果大於等於576px：
此時的容器最小寬度就是540px,即（content:510px + padding:15x2）。如果設備寬度增加，容器的寬度也會增加，但是，margin值也會增加，如：
.container-fluid
.container-fluid則將指定容器的寬度在任意設備上顯示，都是100%的寬度。
03這兩個屬性有什么用？
發現，這兩個class起到的樣式效果易於了解。但是，有什么作用呢?
其實，這是bootstrap的“響應式布局”和“移動端優先”體現。
幾乎所有響應式站點都是這樣，當頁面在屏幕較大的時候，有margin值，更加符合人們的視覺習慣：
而當頁面小到一定程度的時候，就不需要兩側的margin，影響我們的視覺習慣。此時，.container類就起到了作用，
然后就好理解了
除了.container和.container-fluid，bootstrap還預定義了：
container-smcontainer-mdcontainer-lgcontainer-xl
這些預定義的class只是為了幫我們實現對於最小設備尺寸要求的不同的情況下,讓容器寬度的顯示規則更加的靈活。
例如，我希望我的電商平台永遠是100%設備寬度,我就應該使用
.container-fluid這個class; 再例如，我希望我的博客平台在電腦屏幕上有margin，但是只要小於ipadpro(1024px)的屏幕設備，一概100%屏幕寬度顯示，此時我最合適的選擇就是，使用.container-xl這個class，因為它在1140px的屏幕下都是全屏顯示，超出這個寬度，就會有margin值。
需要注意的是，其中，container-sm的效果和container基本是一樣的。