1.bootstrap使用簡單模板
.container類用於固定寬度並支援響應式布局的容器。(兩邊有留白)
...
.container-fluid類用於 100% 寬度，佔據全部視口（viewport）的容器。
...
/* 超小螢幕（手機，小於 768px） */
/* 沒有任何**查詢相關的**，因為這在 bootstrap 中是預設的（還記得 bootstrap 是移動裝置優先的嗎？） */
/* 小螢幕（平板，大於等於 768px） */
@media (min-width: @screen-sm-min)
/* 中等螢幕（桌面顯示器，大於等於 992px） */
@media (min-width: @screen-md-min)
/* 大螢幕（大桌面顯示器，大於等於 1200px） */
@media (min-width: @screen-lg-min)
4.柵格系統的使用
移動裝置和桌面螢幕（表示在不同的裝置上顯示，最多12，超過的就到下一行）
手機、平板、桌面
css樣式和js外掛程式全域性css樣式:
按鈕:class="btn btn-default"
:class="img-responsive" 在任意尺寸都佔100%
形狀:**:class="table":**
class="table-bordered":邊框線
class="table-hover":滑鼠放上去
表單:給表單項新增:class="form-control"
bootstrap整體布局 這裡的乙個row表示一行
水平居中,垂直居中(讓line-light和light的高度一樣就可以了)
text-align:center
height:20px
line-height:20px
電腦端下隱藏：class=『hidden-md hidden-lg』
手機端下隱藏：class=』 visible-lg-block visible-md-block』
Bootstrap入門基礎
最近需要做乙個簡單的web頁面。考慮到前端經驗不足，為了快速產出，同時專案只是乙個工具，對專案沒有什麼要求，所以我選擇了bootstrap這個框架作為web框架。寫從零 學習 bootstrap 的初衷 讓我們先從bootstrap的最簡單的模板開始 讓我們一行行的來看 我用 代表解釋 代表這是ht...
Bootstrap基礎入門
一 bootstrap簡介 二 排版屬性 三 布局模式 四 查詢 五 柵格系統 一 bootstrap簡介 二 排版屬性 lead 使段落突出顯示 small 設定小文字為父文字的85 大小 text left 設定文字左對齊 text center 設定文字居中對齊 text reght 設定文字...
bootstrap入門 表單樣式
linkhref bootstrap.min.css rel stylesheet 插入bootstrap外部樣式表 divclass form group label 使用者名稱 label inputtype email class form control placeholder email ...