📜  bootstrap 4 cdn - Html (1)

📅  最后修改于: 2023-12-03 14:59:32.625000             🧑  作者: Mango

Bootstrap 4 CDN - HTML

Bootstrap 4 CDN (Content Delivery Network) is a hosted version of the popular Bootstrap 4 framework that allows developers to easily add responsive design, typography, forms, buttons, navigation, and other UI components to their web projects without downloading and installing the framework on their own servers.

How to use Bootstrap 4 CDN in HTML

To use Bootstrap 4 CDN in HTML, you can include the following code snippet in the head section of your HTML document:

<head>
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"
    integrity="sha384-OgVRvuATP1z7JjHLkuOUzK6GQ2Pjz9TpC8ik6UdYzh0KkkstTmWT8Wb1/3wDfoP6"
    crossorigin="anonymous">
  <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
    integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
    crossorigin="anonymous"></script>
  <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.3/dist/umd/popper.js"
    integrity="sha384-cb5VdQJkDAd+V5BrGIMsqA1Kt3qMCFowYPPtJcInx4u19AnLucHAXnZwgVHiLlX9"
    crossorigin="anonymous"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"
    integrity="sha384-B0UglyR+jN6IXHM6sitXAaxsAkLrNxZGKZZL7Tv3XFX2T0UksdQRVvoxMh7JhBbm"
    crossorigin="anonymous"></script>
</head>

This code imports the necessary CSS and JavaScript files from the Bootstrap 4 CDN. The integrity and crossorigin attributes ensure that the files are delivered securely and can be trusted by the browser.

Benefits of using Bootstrap 4 CDN
  1. Faster load times: Since the Bootstrap 4 files are hosted on a CDN, users can download them from a server that is closer to their location, resulting in faster load times for your web pages.

  2. Reduced server load: By using a CDN, your server doesn't have to handle the delivery of the Bootstrap 4 files, thus reducing the overall load on your server.

  3. Always up-to-date: With Bootstrap 4 CDN, you can be sure that the latest version of the framework is being used on your web pages, without the need to manually download and install updates.

Conclusion

Bootstrap 4 CDN is a powerful tool for web developers looking to add responsive design and UI components to their web projects. By using Bootstrap 4 CDN, you can save time, reduce server load, and ensure that your web pages are always up-to-date.