bootstrap3優(yōu)先支持什么設備

這篇文章將為大家詳細講解有關bootstrap3優(yōu)先支持什么設備，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

bootstrap3優(yōu)先支持“移動”設備。bootstrap3是移動優(yōu)先的設計思想，設計的所有的樣式默認都會應用到移動設備上，接著利用媒體查詢，一步一步的增加對于其它尺寸設備的設計。

本教程操作環(huán)境：Windows7系統(tǒng)、bootsrap3.3.7版、DELL G3電腦

Bootstrap 3 是一套移動優(yōu)先的前端框架。移動優(yōu)先就是，設計的所有的樣式默認都會應用到移動設備上，然后在設計里，利用媒體查詢，一步一步的增加對于其它尺寸設備的設計。

在之前的 Bootstrap 版本中（直到 2.x），您需要手動引用另一個 CSS，才能讓整個項目友好的支持移動設備。

現(xiàn)在不一樣了，Bootstrap 3 默認的 CSS 本身就對移動設備友好支持。

Bootstrap 3 的設計目標是移動設備優(yōu)先，然后才是桌面設備。這實際上是一個非常及時的轉變，因為現(xiàn)在越來越多的用戶使用移動設備。

為了讓 Bootstrap 開發(fā)的網(wǎng)站對移動設備友好，確保適當?shù)睦L制和觸屏縮放，需要在網(wǎng)頁的 head 之中添加 viewport meta 標簽，如下所示：

<meta name="viewport" content="width=device-width, initial-scale=1.0">

• width 屬性控制設備的寬度。假設您的網(wǎng)站將被帶有不同屏幕分辨率的設備瀏覽，那么將它設置為 device-width 可以確保它能正確呈現(xiàn)在不同設備上。

• initial-scale=1.0 確保網(wǎng)頁加載時，以 1:1 的比例呈現(xiàn)，不會有任何的縮放。

在移動設備瀏覽器上，通過為 viewport meta 標簽添加 user-scalable=no 可以禁用其縮放（zooming）功能。

通常情況下，maximum-scale=1.0 與 user-scalable=no 一起使用。這樣禁用縮放功能后，用戶只能滾動屏幕，就能讓您的網(wǎng)站看上去更像原生應用的感覺。

注意，這種方式我們并不推薦所有網(wǎng)站使用，還是要看您自己的情況而定！

<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, 
user-scalable=no">

關于“bootstrap3優(yōu)先支持什么設備”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。