Bootstrap 入门

本质上讲，Bootstrap 其实就是一个别人写好的 CSS 文件和 JavaScript 文件。通过引入 Bootstrap，可以让我们轻松写出具有响应式布局的页面。

只要为标签添加不同的 Bootstrap 类，就可以应用不同的 Bootstrap 样式。

<!DOCTYPE html>
<html>
<head>
    <!-- 引入 Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
</head>
<body>
    <!-- 网格系统示例 -->
    <div class="container">
        <div class="row">
            <div class="col-md-6">左侧内容</div>
            <div class="col-md-6">右侧内容</div>
        </div>
    </div>

    <!-- 引入 Bootstrap JavaScript -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
</body>
</html>

Bootstrap 官网：getbootstrap.com

参见：freeCodeCamp Bootstrap 入门课程

posted @ 2025-01-14 21:14  Undefined443  阅读(19)  评论(0)    收藏  举报