オンラインCDNリンクのブートストラップとエラーの分析


  1. ブートストラップの基本的なCDNリンク: HTMLファイル内のセクションに次のリンクを追加します。

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
  2. ローカルファイルからブートストラップを使用する: CDNリンクが利用できない場合は、Bootstrapのファイルをダウンロードしてローカルに保存し、以下のようにローカルファイルを参照します。

    <link rel="stylesheet" href="path/to/bootstrap.min.css">
    <script src="path/to/bootstrap.min.js"></script>
  3. エラー: "Failed to load resource: the server responded with a status of 404 (Not Found)"

    • CDNリンクが正しくない可能性があります。リンクを確認し、正しいバージョンのBootstrapを使用していることを確認してください。
    • ファイルのパスが間違っているか、ファイルが存在しない可能性があります。ファイルの場所と名前を確認し、正しいパスを指定していることを確認してください。
  4. エラー: "Uncaught TypeError: $(...).modal is not a function"

    • jQueryが正しく読み込まれていない可能性があります。jQueryのCDNリンクをセクション内に追加し、Bootstrapの前に配置してください。
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>