Bootstrap中CSS的使用方法，供大家參考，具體內(nèi)容如下

1、GitHub上這樣介紹 bootstrap：

☑  簡單靈活可用于架構流行的用戶界面和交互接口的html、css、javascript工具集。
☑  基于html5、css3的bootstrap，具有大量的誘人特性：友好的學習曲線，卓越的兼容性，響應式設計，12列格網(wǎng)，樣式向?qū)臋n。
☑  自定義JQuery插件，完整的類庫，基于Less等。

2、bootstrap模板為使IE6、7、8版本（IE9以下版本）瀏覽器兼容html5新增的標簽，引入下面代碼文件即可。

同理為使IE6、7、8版本瀏覽器兼容css3樣式，引入下面代碼：

3、Bootstrap 使用了一些 HTML5 元素和 CSS 屬性。為了讓這些正常工作，您需要使用 HTML5 文檔類型（Doctype）

4、Bootstrap 3 的設計目標是移動設備優(yōu)先，然后才是桌面設備。為了讓 Bootstrap 開發(fā)的網(wǎng)站對移動設備友好，確保適當?shù)睦L制和觸屏縮放，需要在網(wǎng)頁的 head 之中添加 viewport meta 標簽，如下所示：
（initial-scale=1.0, maximum-scale=1.0, user-scalable=no）

5、響應式圖像

<img src="..." class="img-responsive" alt="響應式圖像">

通過添加 img-responsive class 可以讓 Bootstrap 3 中的圖像對響應式布局的支持更友好。

6、全局樣式（reset.css）
Bootstrap框架在這一部分做了一定的變更，不再一味追求歸零，而是更注重重置可能產(chǎn)生問題的樣式（如，body,form的margin等），保留和堅持部分瀏覽器的基礎樣式，解決部分潛在的問題，提升一些細節(jié)的體驗，具體說明如下：

• 移除body的margin聲明
• 設置body的背景色為白色
• 為排版設置了基本的字體、字號和行高
• 設置全局鏈接顏色，且當鏈接處于懸浮“:hover”狀態(tài)時才會顯示下劃線樣式

Bootstrap 3 使用 body {margin: 0;} 來移除 body 的邊距。
請看下面有關 body 的設置：

body { 
font-family: “Helvetica Neue”, Helvetica, Arial, sans-serif; 
font-size: 14px; 
line-height: 1.428571429; 
color: #333333; 
background-color: #ffffff; 
} 

7、避免跨瀏覽器的不一致

Bootstrap 使用 Normalize 來建立跨瀏覽器的一致性。
Normalize.css 是一個很小的 CSS 文件，在 HTML 元素的默認樣式中提供了更好的跨瀏覽器一致性。

以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。

最新評論