你好，設定方法如下：
首先，簡單介紹一下boostrap，它是一個前端的CSS框架，在它的庫裡面集成了好多CSS樣式。我們可以利用這個框架進行響應式佈局。正因為它可以幫助我們進行響應式頁面佈局，其寬度才有了多種設定方法。
bootstrap是柵格佈局的，不論螢幕寬度是多少，bootstrap都是將螢幕水平方向上分為12列，只是每列的寬度不同，
在boodstrap中div的寬度設定，可以使用庫檔案裡面的col-lg-*,col-md-*和col-sm-*,col-xs-*四個class名稱。
這四個名稱分別對應了螢幕的四種寬度範圍，我們需要在合適的螢幕，應用合適的class。這四個可以兩兩組合，也可以多個或者全部組合。
如果是兩兩組合時，當螢幕寬度變化時，css中會只有一個在起著決定性的作用。例如，我們將col-sm和col-md進行組合。
當這兩個class進行組合的時候，在大於等於992畫素的時候，是採用的col-md-*來設定div所佔據的列數，當小於等於992並且大於等於768的時候，採用col-sm-*來決定div所佔據的列數，小於768px的時候，預設div的寬度為其父級元素寬度的100%
一般情況下，我們都會設定col-md-*或者col-sm-*作為頁面桌面佈局時的div的寬度，但是這兩個class單純設定的區別，在於，如果是隻設定col-md-*，那麼當螢幕寬度小於992的時候，直接就是col-xs-12,如果是col-sm-*則是小於768px的時候是手機版的樣式。這一點我們需要格外注意，通常情況下，小於768的時候是手機版的頁面。
你好，設定方法如下：
首先，簡單介紹一下boostrap，它是一個前端的CSS框架，在它的庫裡面集成了好多CSS樣式。我們可以利用這個框架進行響應式佈局。正因為它可以幫助我們進行響應式頁面佈局，其寬度才有了多種設定方法。
bootstrap是柵格佈局的，不論螢幕寬度是多少，bootstrap都是將螢幕水平方向上分為12列，只是每列的寬度不同，
在boodstrap中div的寬度設定，可以使用庫檔案裡面的col-lg-*,col-md-*和col-sm-*,col-xs-*四個class名稱。
這四個名稱分別對應了螢幕的四種寬度範圍，我們需要在合適的螢幕，應用合適的class。這四個可以兩兩組合，也可以多個或者全部組合。
如果是兩兩組合時，當螢幕寬度變化時，css中會只有一個在起著決定性的作用。例如，我們將col-sm和col-md進行組合。
當這兩個class進行組合的時候，在大於等於992畫素的時候，是採用的col-md-*來設定div所佔據的列數，當小於等於992並且大於等於768的時候，採用col-sm-*來決定div所佔據的列數，小於768px的時候，預設div的寬度為其父級元素寬度的100%
一般情況下，我們都會設定col-md-*或者col-sm-*作為頁面桌面佈局時的div的寬度，但是這兩個class單純設定的區別，在於，如果是隻設定col-md-*，那麼當螢幕寬度小於992的時候，直接就是col-xs-12,如果是col-sm-*則是小於768px的時候是手機版的樣式。這一點我們需要格外注意，通常情況下，小於768的時候是手機版的頁面。