ブートストラップの概要
ブートストラップとは何ですか?
Bootstrap は、Web アプリケーションと Web サイトを迅速に開発するためのフロントエンド フレームワークです。ブートストラップは HTML、CSS、および JAVASCRIPT に基づいています。
歴史
Bootstrap は Twitter の Mark Otto と Jacob Thornton によって開発されました。 Bootstrap は、2011 年 8 月に GitHub でリリースされたオープンソース製品です。
なぜブートストラップを使用するのですか?
モバイル ファースト: Bootstrap 3 以降、フレームワークにはライブラリ全体にモバイル ファースト スタイルが含まれています。
ブラウザのサポート: すべての主要なブラウザがブートストラップをサポートしています。
Internet Explorer Firefox Opera Google Chrome Safari
始めるのは簡単: HTML と CSS の基本的な知識があれば、Bootstrap の学習を始めることができます。
レスポンシブデザイン: Bootstrap のレスポンシブ CSS は、デスクトップ、タブレット、携帯電話に適応できます。レスポンシブ デザインの詳細については、「ブートストラップ レスポンシブ デザイン」を参照してください。
レスポンシブ デザイン
開発者にインターフェイスを作成するためのシンプルで統合されたソリューションを提供します。
強力な組み込みコンポーネントが含まれており、カスタマイズが簡単です。
Webベースのカスタマイズも提供します。
オープンソースです。
Bootstrap パッケージの内容
基本構造: Bootstrap は、グリッド システム、リンク スタイル、背景を備えた基本構造を提供します。これについては、ブートストラップの基本構造セクションで詳しく説明します。
CSS: Bootstrap には、グローバル CSS 設定、基本的な HTML 要素スタイルの定義、拡張可能なクラス、および高度なグリッド システムの機能が付属しています。これについては、「ブートストラップ CSS」セクションで詳しく説明します。
コンポーネント: Bootstrap には、画像、ドロップダウン メニュー、ナビゲーション、アラート ボックス、ポップアップ ボックスなどを作成するための再利用可能なコンポーネントが十数個含まれています。これについては、「レイアウト コンポーネント」セクションで詳しく説明します。
JavaScript プラグイン: Bootstrap には、12 を超えるカスタム jQuery プラグインが含まれています。すべてのプラグインを直接含めることも、個別に含めることもできます。これについては、ブートストラップ プラグインのセクションで詳しく説明します。
カスタマイズ: Bootstrap コンポーネント、LESS 変数、jQuery プラグインをカスタマイズして、独自のバージョンを取得できます。
オンライン例
このサイトのブートストラップ チュートリアルには何百もの例が含まれています。
オンラインエディターを使用してオンラインでコードを編集し、実行ボタンをクリックして結果を確認できます。
ブートストラップの例
<div class="container"> <div class="jumbotron"> <h1>我的第一个 Bootstrap 页面</h1> <p>重置窗口大小,查看响应式效果!</p> </div> <div class="row"> <div class="col-sm-4"> <h3>Column 1</h3> <p>学的不仅是技术,更是梦想!</p> <p>再牛逼的梦想,也抵不住你傻逼似的坚持!</p> </div> <div class="col-sm-4"> <h3>Column 2</h3> <p>学的不仅是技术,更是梦想!</p> <p>再牛逼的梦想,也抵不住你傻逼似的坚持!</p> </div> <div class="col-sm-4"> <h3>Column 3</h3> <p>学的不仅是技术,更是梦想!</p> <p>再牛逼的梦想,也抵不住你傻逼似的坚持!</p> </div> </div></div>