在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 教程/ HTML/ 概覽
警告框
標(biāo)簽頁(yè)
代碼
輪播
進(jìn)度條
輔助類
按鈕組
社區(qū)
標(biāo)簽
導(dǎo)航
響應(yīng)式工具
禁止響應(yīng)式布局
工具提示
概覽
媒體對(duì)象
概覽
具有響應(yīng)式特性的嵌入內(nèi)容
Well
折疊
下載
對(duì)第三方組件的支持
Glyphicons 字體圖標(biāo)
編譯 CSS 和 JavaScript 文件
徽章
柵格系統(tǒng)
瀏覽器和設(shè)備的支持情況
輸入框組
表格
滾動(dòng)監(jiān)聽(tīng)
下拉菜單
排版
巨幕
按鈕
頁(yè)頭
使用 Sass
包含的內(nèi)容
縮略圖
模態(tài)框
基本模板
面版
圖片
路徑導(dǎo)航
分頁(yè)
導(dǎo)航條
警告框
過(guò)渡效果
從 v2.x 版本升級(jí)到 v3.x 版本
工具
可訪問(wèn)性
彈出框
按鈕式下拉菜單
表單
列表組
按鈕
使用 Less
下拉菜單

概覽

深入了解 Bootstrap 底層結(jié)構(gòu)的關(guān)鍵部分，包括我們讓 web 開發(fā)變得更好、更快、更強(qiáng)壯的最佳實(shí)踐。

HTML5 文檔類型

Bootstrap 使用到的某些 HTML 元素和 CSS 屬性需要將頁(yè)面設(shè)置為 HTML5 文檔類型。在你項(xiàng)目中的每個(gè)頁(yè)面都要參照下面的格式進(jìn)行設(shè)置。

    <!DOCTYPE html>
    <html lang="zh-CN">
      ...
    </html>

移動(dòng)設(shè)備優(yōu)先

在 Bootstrap 2 中，我們對(duì)框架中的某些關(guān)鍵部分增加了對(duì)移動(dòng)設(shè)備友好的樣式。而在 Bootstrap 3 中，我們重寫了整個(gè)框架，使其一開始就是對(duì)移動(dòng)設(shè)備友好的。這次不是簡(jiǎn)單的增加一些可選的針對(duì)移動(dòng)設(shè)備的樣式，而是直接融合進(jìn)了框架的內(nèi)核中。也就是說(shuō)，Bootstrap 是移動(dòng)設(shè)備優(yōu)先的。針對(duì)移動(dòng)設(shè)備的樣式融合進(jìn)了框架的每個(gè)角落，而不是增加一個(gè)額外的文件。

為了確保適當(dāng)?shù)睦L制和觸屏縮放，需要在 <head> 之中添加 viewport 元數(shù)據(jù)標(biāo)簽。

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

在移動(dòng)設(shè)備瀏覽器上，通過(guò)為視口（viewport）設(shè)置 meta 屬性為 user-scalable=no 可以禁用其縮放（zooming）功能。這樣禁用縮放功能后，用戶只能滾動(dòng)屏幕，就能讓你的網(wǎng)站看上去更像原生應(yīng)用的感覺(jué)。注意，這種方式我們并不推薦所有網(wǎng)站使用，還是要看你自己的情況而定！

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

排版與鏈接

Bootstrap 排版、鏈接樣式設(shè)置了基本的全局樣式。分別是：

  • 為 body 元素設(shè)置 background-color: #fff;
  • 使用 @font-family-base、@font-size-base 和 @line-height-base a變量作為排版的基本參數(shù)
  • 為所有鏈接設(shè)置了基本顏色 @link-color ，并且當(dāng)鏈接處于 :hover 狀態(tài)時(shí)才添加下劃線

這些樣式都能在 scaffolding.less 文件中找到對(duì)應(yīng)的源碼。

Normalize.css

為了增強(qiáng)跨瀏覽器表現(xiàn)的一致性，我們使用了 Normalize.css，這是由 Nicolas Gallagher 和 Jonathan Neal 維護(hù)的一個(gè)CSS 重置樣式庫(kù)。

布局容器

Bootstrap 需要為頁(yè)面內(nèi)容和柵格系統(tǒng)包裹一個(gè) .container 容器。我們提供了兩個(gè)作此用處的類。注意，由于 padding 等屬性的原因，這兩種 容器類不能互相嵌套。

.container 類用于固定寬度并支持響應(yīng)式布局的容器。

    <div class="container">
      ...
    </div>

.container-fluid 類用于 100% 寬度，占據(jù)全部視口（viewport）的容器。

    <div class="container-fluid">
      ...
    </div>