千年殇,小说阅读网免费小说,小说排行榜

本節內容小編為大家精選帶來的是pdf格式免費版BootStrap初學者入門教程，如果你是一個BootStrap初學者，正好需要一份這樣的bootstrap教程，那就趕緊點擊本文下方的“立即下載”進行查閱吧！

溫馨提示：

本文檔為PDF格式文檔，因此需確保在閱讀之前你已經安裝了PDF閱讀器，如果尚未安裝閱讀器，建議下載福昕PDF閱讀器或其他PDF閱讀器進行安裝后閱讀。

BootStrap初學者入門教程內容節選

……

GitHub 上這樣介紹 bootstrap：簡單靈活可用于架構流行的用戶界面和交互接口的html,css,javascript工具集。基于 html5、css3的 bootstrap，具有大量的誘人特性：友好的學習曲線，卓越的兼容性，響應式設計，12列格網，樣式向導文檔，自定義JQuery插件，完整的類庫，基于 Less等。本系列教程遵循官方文檔結構來介紹bootstrap，包括手腳架（Scaffolding),基礎CSS,組件,javascript插件，使用 LESS與自定義.本文主要介紹Bootstrap 的基礎布局--Scaffolding.

Bootstrap 建立了一個響應式的12列格網布局系統，它引入了 fixed 和 fluid-with 兩種布局方式。我們從全局樣式(Global Style),格網系統(Grid System),流式格網(Fluid grid System),自定義(Customing),布局(Layouts),響應式設計(Responsive Design)這六五個方面深入講解Boostrap 的 scaffolding.

1 全局樣式(Global Style).Bootstrap 要求 html5的文件類型，所以必須在每個使用 bootstrap 頁面的開頭都引用:

<!DOCTYPE html>

<htmllang="en"> ...

……

圖1-3 嵌套列(Nesting columns) 以下代碼實現了是實現圖1-3中，第一層的寬度為12和第二層兩個寬度為6的兩個div. <divclass="row">

<divclass="span12"> Level 1 of column

<divclass="row">

<divclass="span6">Level 2</div>

</div>

嵌套的 div長度之和不能大于它的父 div，否則會溢出疊加。各位可以試試將第一層的div長度改為其他值，看看效果。

4 流式格網系統(Fluid grid system).它使用%，而不是固定的px,來確定頁面要素的寬度.只需要簡單的將.

row 改成.row-fluid ，就可以將fixed行改為fluid.如圖1-4所示：

……

1.2 強調(Emphasis).使用<strong>和<em>兩個標簽，前者使用粗體，后者使用斜體來強調標簽內容。請注意<strong>標簽在html4中定義語氣更重的強調文本；在 HTML 5 中，<strong> 定義重要的文本。這些短語標簽也可以通過定義 CSS 的方式來豐富效果。更多短語標簽請參見[1].縮寫(abbreviations ).使用<abbr>，它重新封裝了該標簽，鼠標滑過會異步地顯示縮寫的含義。引入 title 屬性來顯示原文，使用.initialism 類對縮寫以大寫方式顯示。

1.3 引用文字(Blockquotes).使用<blockquote>標簽和<small>兩個標簽，前者<blockquote>是引用的文字內容，后者<small>是可選的要素，能夠添加書寫式的引用，比如內容作者。如圖2-2所示

……

BootStrap初學者入門教程相關內容小編就為大家介紹到這里了，更多pdf格式文檔資料下載，敬請關注東坡下載站！