Rumah > Artikel > hujung hadapan web > Bagaimana untuk mengimport rangka kerja bootstrap
Bagaimana untuk mengimport rangka kerja bootstrap
- 下次还敢asal
- 2024-04-01 22:48:221329semak imbas
Kaedah untuk mengimport rangka kerja Bootstrap: Import CDN: Import fail Bootstrap dengan merujuk pautan CDN. Muat turun manual: Muat turun fail Bootstrap dari tapak web rasmi dan importnya secara manual. Import Sass/LESS: Gunakan pengkompil untuk menukar fail sumber Bootstrap kepada CSS. Pilih versi: Pilih versi Bootstrap yang sesuai mengikut keperluan anda. Pesanan import: Import jQuery sebelum mengimport fail CSS Bootstrap.
Kaedah import rangka kerja Bootstrap
Import menggunakan CDN
Cara paling mudah ialah mengimport rangka kerja Bootstrap melalui CDN:
<code class="html"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script></code>
kod HTML anda di atas Bahagian kepala> sudah memadai. <head> 部分即可。
手动下载导入
也可以从Bootstrap官方网站下载框架文件并手动导入：
- 下载Bootstrap文件并解压缩。
- 将
bootstrap.min.css文件复制到你的CSS目录。 - 将
bootstrap.bundle.min.js文件复制到你的JS目录。 - 在你的HTML文件的
<head>
Anda juga boleh memuat turun fail rangka kerja dari tapak web Bootstrap rasmi dan mengimportnya secara manual:
Muat turun fail Bootstrap dan nyahzipnya. Salin failbootstrap.min.css ke direktori CSS anda. Salin fail bootstrap.bundle.min.js ke direktori JS anda.
<head> fail HTML anda:
<code class="html"><link rel="stylesheet" href="path/to/bootstrap.min.css"> <script src="path/to/bootstrap.bundle.min.js"></script></code>
Sass/LESS import
- Jika anda membangunkan dengan Sass atau LESS, anda boleh menggunakan compile Alat ini menyusun fail sumber Bootstrap ke dalam CSS:
<code>// 使用Sass @import "~bootstrap/scss/bootstrap"; // 使用LESS @import "~bootstrap/less/bootstrap";</code>
Selepas penyusunan selesai, import fail CSS yang disusun ke dalam fail HTML anda. - Pilih versi
Atas ialah kandungan terperinci Bagaimana untuk mengimport rangka kerja bootstrap. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!