天天看點

Bootstrap速學教程之簡要介紹

  Bootstrap是Twitter推出的一個用于前端開發的開源工具包,由Twitter的設計師Mark Otto和Jacob Thornton合作開發,是一個CSS/HTML架構,不用請UI設計師也能開發出中規中矩的網頁,并且最重要的是支援html5、css3移動端自适應,現在很多所謂的三合一五合一網站是基于bootstrap搭建的。

  我們來看一個簡單的例子

  筆記:

  1.Bootstrap 使用到的某些 HTML 元素和 CSS 屬性需要将頁面設定為 HTML5 文檔類型。

  2.Bootstrap 不支援 IE 古老的相容模式。為了讓 IE 浏覽器運作最新的渲染模式下,建議将此 <meta> 标簽加入到你的頁面中 IE=edge

  3.Bootstrap 3 是移動裝置優先的。針對移動裝置的樣式融合進了架構的每個角落,而不是增加一個額外的檔案。為了確定适當的繪制和觸屏縮放,需要在 <head> 之中添加 viewport 中繼資料标簽。可選設定(viewport)設定 meta 屬性為 user-scalable=no可以禁用其縮放(zooming)功能。這樣禁用縮放功能後,使用者隻能滾動螢幕,就能讓你的網站看上去更像原生應用的感 覺。

  4.jquery用1.*版本,2.0版本不支援ie6/7/8

  5.<nav>是bootstrap中内置的導航樣式,pc端可以展示完整的一行,移動端會收縮到右上角的菜單menu中

  6.内容主體div可以用container,有固定寬度并支援響應式布局的容器,container-fluid用于 100% 寬度

繼續閱讀