關於Bootstrap的入門知識
阿新 • • 發佈：2018-05-09
emp 前端 直接 AD 1.4 link 3.3 str 世界
問：Bootstrap是什麽？
答：開源的前端框架，就是一些事先寫好的css、js等。
問：Bootstrap在哪兒下載？
答：官方（https://getbootstrap.com/），中文（http://www.bootcss.com/）
問：Bootstrap怎麽用？
答：網頁中引入css等，然後為html標簽添加class屬性，便按Bootstrap中事先設計的樣式呈現。
例如： <link rel="stylesheet" href="bootstrap.min.css"/>
問：bootstrap.css 和 bootstrap.min.css 有啥區別？
答：沒區別，您可以無差別地使用它們。概況的說，前者便於肉眼閱讀，推薦在開發環境使用；後者用於機器識別，推薦在生產環境部署。
問：Bootstrap框架中都有些啥？
答：響應式的柵格系統，不錯的元素CSS樣式、組件、插件等，免去您逐一設計調試的辛勞，當然，您也可以定制，做得更加精致和靈活（LESS）。總之，您不必再為頁面簡陋感到遺憾。
問：最佳實踐？
答：一、您需要自行準備jQuery，所有的插件都依賴jQuery。到http://jquery.com/去下載。
特別註意jQuery要在Bootstrap的js文件之前引入，例如：
二、參考基本模版，它指引您正確的引用框架和做必要的設置。以下是Bootstrap中文網提供的基本模版：
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 上述3個meta標簽*必須*放在最前面，任何其他內容都*必須*跟隨其後！ --> <title>Bootstrap 101 Template</title><!-- Bootstrap --> <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <!-- HTML5 shim 和 Respond.js 是為了讓 IE8 支持 HTML5 元素和媒體查詢（media queries）功能 --> <!-- 警告：通過 file:// 協議（就是直接將 html 頁面拖拽到瀏覽器中）訪問頁面時 Respond.js 不起作用 --> <!--[if lt IE 9]> <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script> <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <h1>你好，世界！</h1> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依賴 jQuery，所以必須放在前邊) --> <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script> <!-- 加載 Bootstrap 的所有 JavaScript 插件。你也可以根據需要只加載單個插件。 --> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </body> </html>
問：不明白——為 Bootstrap 專門構建的免費的 CDN 加速服務——是什麽？
答：您不想下載Bootstrap的話，可以在您的頁面中直接引用網上提供的這些框架文件，所謂CDN加速服務只是讓你能用到速度更快的那個站點提供的文件而已。
關於Bootstrap的入門知識