關於bootspart學習筆記,常用標籤及作用

2021-07-26 22:19:08 字數 1346 閱讀 1561

bootstrap 是目前最流行的前端框架,所以這是必須要掌握的技術。

在網頁的 head 之中新增 

viewport meta

標籤,

name

="viewport"

content

="width=device-width, initial-scale=1.0"

>

將width設定為

device-width

可以確保它能正確呈現在不同裝置上,

initial-scale=1.0

確保網頁載入時,以 1:1 的比例呈現,不會有任何的縮放。

在移動裝置瀏覽器上,通過為 viewport meta 標籤新增 user-scalable=no 可以禁用其縮放(zooming)功能。通常情況下,

maximum-scale=1.0

與 user-scalable=no 一起使用。這樣禁用縮放功能後,使用者只能滾動螢幕,就能讓您的**看上去更像原生應用的感覺。

但要根據自身情況使用。

bootstrap的網格系統,預設最多12列,工作原理不細說,畫個三個相等的列,下面**也是網格結構的基本結構,舉例子:

container

">

col-xs-4">

class = "

col-xs-4

">

class = "

col-xs-4

">

關於使用

class=「img-responsive」 使影象按比例縮放。

class=「container

」 頁面內容容器,一般放在最外層

關於class="col-xx-xx" 的使用, 第乙個xx,是根據適用裝置的解析度設定的 1、超小裝置<768px 使用col-xs-xx 2、小型裝置≥768px使用col-sm-xx px

3、中型裝置≥992px 使用col-md-xx 4、大型裝置≥1200px 使用col-lg-xx 最後乙個xx則根據需要劃分的列進行自定義,最小1,最大12。

class="

col-md-offset-*

"     使列偏移,通過調整左外邊距實現偏移,*代表偏移量,範圍1-11.

.col-md-push-*和.col-md-pull-*      可通過這兩個class進行順序排列,其原理是col-md-push-*距離左邊的距離調整,col-md-pull-*   距離右邊的距離調整,

(即right : xx%;) 其中 

*範圍是從 1到 

11。

未完待續。。。

學習筆記 關於委託

這是乙個委託的例子 using system using system.collections.generic using system.linq using system.text using system.threading.tasks public delegate void mydelete...

Getting Real學習筆記 關於編碼

getting real學習筆記 關於編碼 小巧的軟體 隨著 量的增加,你軟體的複雜度也會隨之增 加,每一次調整和變動的效果都會疊加,所以讓你的程式 盡可能的保持簡潔。那麼抵制這種 複雜化的最好方法就是只做小巧的軟體,它也意味著更少的功 能 更少的 和更少的浪費。小巧的軟體讓你放棄對未來功能的規劃,...

關於SQL的學習筆記

將兩次查詢的記錄結果混和成乙個結果進行輸出 中心思想在於將兩次查詢的結果分別作為乙個新的表,將2張新表盡心一次混和查詢,一共至少3次查詢,成功輸出結果表 基本結構為 select from select from datatable1 下面是我的例子 select distinct from sel...