[bootstrap] 在html中引入bootstrap

最新推荐文章于 2024-02-26 16:51:43 发布

尉迟海棠

最新推荐文章于 2024-02-26 16:51:43 发布

阅读量1.5k

点赞数

分类专栏： web

本文链接：https://blog.csdn.net/GYK0812/article/details/108943223

版权

web 专栏收录该内容

37 篇文章 0 订阅

订阅专栏

该博客展示了如何在HTML中引入Bootstrap的CSS样式表、jQuery库和Bootstrap自身的JavaScript文件，以实现页面的基础美化和交互功能。示例中，通过`<img>`标签的`class`属性应用了Bootstrap的`img-rounded`和`img-circle`样式，创建了两种不同边框效果的图片展示。

摘要由CSDN通过智能技术生成

1. 引入bootstrap样式表

2. 引入jquery

3. 引入bootstrap自身的 .js文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>1-3 引入bootstrap</title>
    <!-- 1. 引入bootstrap的css样式表 -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <!-- 2. 引入bootstrap依赖的jquery文件 -->
    <script src="js/jquery-3.5.1.min.js"></script>
    <!-- 3. 引入bootstrap自身的脚本文件 -->
    <script src="js/bootstrap.min.js"></script>
</head>
<body>
    <img src="img/1.jpg" alt="picture" class='img-rounded' width="200">
    <img src="img/1.jpg" alt="picture" class='img-circle' width="200">
</body>
</html>