bootstrap導入方法
1 bootstrapの公式を開く https://getbootstrap.com/docs/4.5/getting-started/introduction/
２ 公式の「Get started」をクリック。（ダウンロードかリンクへのアクセスかの２通りの利用方法があるが、特別な理由がない限り下記の方法でのリンクアクセスで良い。わざわざダウンロードしてPCの容量を圧迫する必要はない。）
３ IntroductionのQuick startの真下にある、CSSのCopy-paste the stylesheet into your
before all other stylesheets to load our CSS.と書かれた直下のコード<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css 以下略をコピー。
４ 自分の作りたいアプリ等のhtmlファイルに貼り付ける。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ホゲホゲ</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" ←ここから、
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> ←ここまでが貼り付けたコードです。
<style>
５ これで準備は完了。
特徴として、class名に ナビバーならclass="navbar-nav、各種ボタンならclass="btn btn-primary などの対応したclass名が必要になり、それによって上記のlink relのアクセス先から対応したcssを読み取ってナビバーやボタンなどを表示できるようになる。ハンバーガーメニューもある。
いずれも、準備後はbootstrap公式に記載された、自分がほしい機能の項目に書いてあるコードをコピーしてhtmlに貼り付けるだけですぐに使える。
また、bootstrapはグリッドメニューにも対応しており、画面を縦に１２分割したカラム分けをすることができる。（短冊のように画面を縦割りで管理できる）
分割ごとにブロックを作ることもできる。（ぷよぷよをイメージしてもらうとわかりやすい）
これによってレスポンシブデザインにも対応していて、PC・タブレット・スマホそれぞれに対応した画面表示になってくれる。公式サイトにも使われているから、公式の画面を縮めてみればわかる。
（ハンバーガーメニューは、スマホ並みに画面（ウィンドウ）を縮めないとハンバーガーメニューが表示されないようなので、縮めていないと「ハンバーガーメニューのコード貼り付けたのにでない‥！？」となるので注意。
Author And Source
この問題について(bootstrap導入方法), 我々は、より多くの情報をここで見つけました https://qiita.com/kohya-suzuki/items/028e22b99b973b6d628f著者帰属：元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .