2023-03-10 最新 v5.3.3 に更新
v5.3.3
<head>内に下記を追加
|
1 |
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" integrity="sha384-fmAz1I/QD4m4yKjSHzX9IovDRRXoqxPze+nZQ2ue5Kh5KjHXalNmEhBlkgIzC9uO" crossorigin="anonymous"> |
</body>の直前に下記を追加
|
1 |
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-3sFcsZs0szyRnTgTwrjKMYc/ivz/9YZgQ2nKUE3xZwH58LsN8jKKeVbld+i+sCCy" crossorigin="anonymous"></script> |
jquery読み込み（オプション） 3.6.0
|
1 |
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha384-G0zK2wEPwDBU+8ZH7T2n0wn6U8W6ZwwTpPCYlq6pLddgD8Ww3T/F4zo1xhxh+NqF" crossorigin="anonymous"></script> |
Font Awesome読み込み（オプション）
6
|
1 |
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v6.1.0/css/all.css" integrity="sha384-32X9fjlz7piOJ64yLhNAbv57gP/uN6R+0GZC0SDg5X/01r3RY1uIbV7wC2LkmAa7" crossorigin="anonymous"> |
5
|
1 |
<link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet"> |
4
|
1 |
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> |
サンプルHTML
BootstrapJavaScriptにPopper.jsが含まれた読み込み。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<!doctype html> <html lang="ja"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap5 基本CDNテンプレート</title> <!-- CSS only 5.3.3 --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" integrity="sha384-fmAz1I/QD4m4yKjSHzX9IovDRRXoqxPze+nZQ2ue5Kh5KjHXalNmEhBlkgIzC9uO" crossorigin="anonymous"> <!-- Font Awesome 6.1.0 --> <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v6.1.0/css/all.css" integrity="sha384-32X9fjlz7piOJ64yLhNAbv57gP/uN6R+0GZC0SDg5X/01r3RY1uIbV7wC2LkmAa7" crossorigin="anonymous"> </head> <body> <!-- コンテンツ --> <!-- /コンテンツ --> <!-- JavaScript Bundle with Popper 5.3.3 --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-3sFcsZs0szyRnTgTwrjKMYc/ivz/9YZgQ2nKUE3xZwH58LsN8jKKeVbld+i+sCCy" crossorigin="anonymous"></script> <!-- jquery 3.6.0 --> <script src="//code.jquery.com/jquery-3.6.0.min.js"></script> </body> </html> |
コメント