ブートストラップをインポートする方法

下次还敢
リリース: 2024-04-05 02:09:22
オリジナル
889 人が閲覧しました

Bootstrap フレームワークをインポートするには 4 つの方法があります。 CDN を介して HTML コードを追加します。 npm を使用して、JavaScript ファイルをインストールおよびインポートします。 Bootstrap をダウンロードし、ローカルの CSS および JavaScript ファイルを参照します。 Sass または Less 経由でプリプロセッサ ファイルをインストールおよびインポートします。

ブートストラップをインポートする方法

Bootstrap をインポートする方法

Bootstrap は、Web 開発を簡素化し、応答性の高い Web サイトを作成する人気のフロントエンド フレームワークです。 。 Bootstrap をインポートするには、複数の方法があります:

1. CDN (Content Delivery Network)

これが最も簡単な方法です。次のコードを HTML ヘッダーに追加します:

 
ログイン後にコピー

2. Node.js パッケージ マネージャー (npm)

JavaScript パッケージ マネージャー npm を使用する場合、次のことができます。次のコマンドを実行します:

npm install bootstrap --save
ログイン後にコピー

次に、コード内で Bootstrap を参照します:

import 'bootstrap'
ログイン後にコピー

3. ローカル ダウンロード

Bootstrap Web サイト バージョンから最新のものをダウンロードします。そしてそのファイルをプロジェクト ディレクトリにコピーします。次に、コード内でそれらを参照します:

 
ログイン後にコピー

4. Sass or Less 経由でインストール

Sass or Less プリプロセッサを使用する場合は、Bootstrap の Sass or Less バージョンをインストールできます。 。

# Sass npm install bootstrap-sass --save # Less npm install bootstrap-less --save
ログイン後にコピー

次に、Bootstrap を Sass 以下のファイルにインポートします:

@import 'bootstrap'
ログイン後にコピー

注:

  • Bootstrap 4 バージョンの場合は、を置き換えます。 5.2.0-beta14.6.2
  • Bootstrap 5 アルファ バージョンの場合は、5.2.0-beta15.0.0-alpha6に置き換えます。
  • Bootstrap.css は他の CSS ファイルの前に必ず配置してください。

以上がブートストラップをインポートする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!