在Bootstrap中極其重要的一個技術內容便是響應式布局了,一次編碼針對不同設備終端的強大能力使得響應式技術愈發流行。
不過正所謂“蘿卜青菜各有所愛”,如果你想要使用Bootstrap開發自己的項目卻又恰巧不太喜歡響應式布局(或者你所設計的頁面布局不允許你使用響應式技術),那么你可以通過以下方式禁用響應式布局。
移除標簽
禁用第一步,就是需要移除在head標簽中添加的
<meta name="viewport" content="width=device-width, initial-scale=1.0”>
該標簽的作用在于使得你的網站在移動設備端被訪問的時候,不會進行縮放,而是以100%的比例顯示在移動設備中。
設定寬度
禁用第二步,為.container類設置一個寬度,從而覆蓋它根據設備寬度而自動調節的功能。
例如你可以設定.container {width: 980px;},為了起到覆蓋原bootstrap樣式的作用,最好將你自定義的css文件在bootstrap.css文件之后引入。
刪除菜單折疊
倘若你采用了導航欄,那么就要注意刪掉菜單在移動端的折疊樣展開式(主要通過button的navbar-toggle來實現)。
柵格布局
除此之外,如果你采用了柵格布局,那么就要采用.col-xs-*(最小設備柵格類)的樣式來代替.col-md-*以及.col-lg-*,這樣就能確保柵格能夠在所有設備中展開。
Bootstrap 會自動幫你針對不同的屏幕尺寸調整你的頁面,使其在各個尺寸的屏幕上表現良好。下面我們列出了如何禁用這一特性,就像這個非響應式布局實例頁面一樣。
以上所述是小編給大家介紹的Bootstrap禁用響應式布局的實現方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持!
新聞熱點
疑難解答