BootStrap の概要と、それを展開およびインストールする方法 (概要)-htmlチュートリアル-php.cn

BootStrap の概要と、それを展開およびインストールする方法 (概要)

青灯夜游

リリース： 2018-10-13 16:31:01

転載

3122 人が閲覧しました

この記事では、BootStrap とは何か、およびそれを展開およびインストールする方法を紹介します。困っている友人は参考にしていただければ幸いです。ブートストラップチュートリアルにアクセスして、ブートストラップ関連のビデオチュートリアルを入手して学習することもできます。

Bootstrap の概要

Bootstrap とは何ですか?

Bootstrap は、Twitter の Mark Otto と Jacob Thornton によって開発されました。

Bootstrap は、2011 年 8 月に GitHub でリリースされたオープンソース製品です。

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

Bootstrap は応答性の高いレイアウトをサポートしており、多くのレイアウトと互換性があります。端末（パソコン、タブレット、携帯電話）からアクセスします。 ##Bootstrap の展開とインストール

##1.公式 Web サイト https://v3.bootcss.com/ からブートストラップフレームワークをダウンロードします。

2. ダウンロードしたフレームワークをルートディレクトリに置き、ファイルをインポートします。

モバイルデバイスファーストのステートメントをサポートするには、ヘッドタグ

 <meta name="viewport" content="width=device-width, initial-scale=1">

ログイン後にコピー

の上にステートメントを配置してから、ブートストラップ CSS ファイルを導入する必要があります。

ブートストラップフレームワークは jQuery に依存しているため、最初に jQuery ライブラリを導入し、次にブートストラップ js ファイルを導入する必要があります。

以下は、フレームワークを導入する完全なコードです。

(ブートストラップ js ファイルは本体の下部に配置するのが最適です)

	<head>
		<meta charset="UTF-8">
		<!--支持移动设备优先-->
		<meta name="viewport" content="width=device-width,initial-scale=1">
		<title>测试文档</title>
		<!--引入 Css 文件-->
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
		<!--引入 jQuery 文件-->
		<script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
		<!--引入 bootstrap 框架 js 文件-->
		<script src="js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
	</head>

ログイン後にコピー

3. jQuery ファイルの下の head タグで公式に提供されている CDN

を使用することもできます。

インターネット接続が必要です。アクセスできます。

<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

ログイン後にコピー

要約: 上記がこの記事の全内容です。皆さんの学習に役立つことを願っています。

以上がBootStrap の概要と、それを展開およびインストールする方法 (概要)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。