Rumah > hujung hadapan web > Tutorial Bootstrap > Bagaimana untuk memperkenalkan html ke dalam bootstrap

Bagaimana untuk memperkenalkan html ke dalam bootstrap

下次还敢
Lepaskan: 2024-04-05 02:27:15
asal
465 orang telah melayarinya

Langkah-langkah untuk memperkenalkan Bootstrap ke dalam HTML adalah seperti berikut: Muat turun fail Bootstrap dari tapak web rasmi dan nyahzipnya. Salin fail CSS dan JS ke dalam direktori fail HTML. Pautkan helaian gaya dalam bahagian <head> HTML dan JavaScript di bahagian bawah. (Pilihan) Gunakan CDN untuk meningkatkan kelajuan dan prestasi pemuatan.

Bagaimana untuk memperkenalkan html ke dalam bootstrap

Bootstrap memperkenalkan HTML

Bagaimana untuk memperkenalkan Bootstrap ke dalam HTML?

Perkenalkan Bootstrap ke dalam HTML dengan langkah berikut:

  1. Muat turun fail Bootstrap:

    • Lawati tapak web rasmi Bootstrap (https://getbootstrap.com/) dan muat turun versi stable terkini
    • Ekstrak fail ZIP yang dimuat turun.
  2. Salin fail CSS dan JS:

    • Salin bootstrap.css daripada folder yang dinyahzip ke direktori fail HTML anda. bootstrap.css 复制到您的 HTML 文件目录下。
    • 将解压缩的文件夹中的 bootstrap.js 复制到您的 HTML 文件目录下。
  3. 在 HTML 中链接 CSS 和 JS 文件:

    • 在 HTML 文件的 <head> 部分中,链接样式表:

      <code class="html"><link rel="stylesheet" href="bootstrap.css"></code>
      Salin selepas log masuk
    • 在 HTML 文件的底部,链接 JavaScript:

      <code class="html"><script src="bootstrap.js"></script></code>
      Salin selepas log masuk

示例:

<code class="html"><!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="bootstrap.css">
</head>
<body>
  <div class="container">
    <h1>Hello, Bootstrap!</h1>
  </div>
  <script src="bootstrap.js"></script>
</body>
</html></code>
Salin selepas log masuk

使用 CDN:

您也可以使用 CDN(内容分发网络)来引入 Bootstrap,它可以提高加载速度和性能。

在 HTML 文件的 <head>

Salin bootstrap.js dalam folder yang dinyahzip ke direktori fail HTML anda. 🎜🎜🎜🎜🎜🎜Pautkan fail CSS dan JS dalam HTML: 🎜🎜🎜🎜🎜Dalam bahagian <head> fail HTML, pautkan lembaran gaya: 🎜
<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.min.js"></script></code>
Salin selepas log masuk
🎜🎜 dalam HTML fail Di bahagian bawah, paut JavaScript: 🎜rrreee🎜🎜🎜🎜🎜 Contoh: 🎜🎜rrreee🎜🎜 Menggunakan CDN: 🎜🎜🎜 Anda juga boleh menggunakan CDN (Content Delivery Network, yang boleh menambah baik Bootstrap kelajuan dan prestasi. 🎜🎜Gunakan kod berikut dalam bahagian <head> fail HTML anda: 🎜rrreee

Atas ialah kandungan terperinci Bagaimana untuk memperkenalkan html ke dalam bootstrap. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan