ブートストラップとは主に何ですか?-ブートストラップのチュートリアル-php.cn

ブートストラップとは主に何ですか?

藏色散人

リリース： 2019-07-20 14:03:59

オリジナル

5041 人が閲覧しました

#ブートストラップとは何ですか?

ブートストラップは主に、Web アプリケーションと Web サイトを迅速に開発するためのフロントエンドフレームワークです。 . .

現代の Web 開発では、ほぼすべての Web プロジェクトで必要なコンポーネントがいくつかあります。

Bootstrap は、グリッド、タイポグラフィ、テーブル、フォーム、ボタン、応答性といった基本モジュールをすべて提供します。

さらに、ドロップダウン、ナビゲーション、モーダル、タイプヘッド、ページネーション、カルーサル、ブレッドクラム、タブ、サムネイル、ヘッダーなど、他にも便利なフロントエンドコンポーネントが多数あります。

これらを使用すると、Web プロジェクトを構築し、より速く簡単に実行できます。

さらに、フレームワーク全体がモジュールベースであるため、独自の CSS を使用してカスタマイズしたり、プロジェクトの開始後に大幅な見直しを行ったりすることもできます。

上記は公式すぎます

Bootstrap は Web ページを作成するためのフレームワーク (現在最も人気のある WEB フロントエンドフレームワークの 1 つ) です。つまり、必要なのはこのクラスを使用すると、ハイエンドの Web ページをすばやく作成できます。互換性の問題を心配する必要はありません。多くのスタイルから選択できます。

たとえば、Web サイトのテキスト表示を作る必要がありますよね? 自分で書くと多くのコードを書く必要がありますが、ブートストラップフレームワークを使用して書くと、 HTMLタグを記述してクラス名を呼び出します。コードを以下に示します。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>Bootstrap 实例 - 强调</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">  
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
 
<small>本行内容是在标签内</small><br>
<strong>本行内容是在标签内</strong><br>
<em>本行内容是在标签内，并呈现为斜体</em><br>
<p class="text-left">向左对齐文本</p>
<p class="text-center">居中对齐文本</p>
<p class="text-right">向右对齐文本</p>
<p class="text-muted">本行内容是减弱的</p>
<p class="text-primary">本行内容带有一个 primary class</p>
<p class="text-success">本行内容带有一个 success class</p>
<p class="text-info">本行内容带有一个 info class</p>
<p class="text-warning">本行内容带有一个 warning class</p>
<p class="text-danger">本行内容带有一个 danger class</p>
 
</body>
</html>

ログイン後にコピー

効果は次のとおりです:

ブートストラップとは主に何ですか?