Bootstrap基本介绍及运用

【小袁】

已于 2022-03-31 17:04:07 修改

阅读量2.7k

点赞数 2

文章标签： bootstrap

于 2022-03-31 14:16:18 首次发布

本文链接：https://blog.csdn.net/m0_62839141/article/details/123870737

版权

本文介绍了Bootstrap的基本概念，强调其作为响应式前端框架的特性，以及为何学习Bootstrap的原因，包括响应式设计、移动设备优先和易于上手。通过下载和使用Bootstrap库，详细说明了如何引入CSS和JS文件。通过多个案例对比，展示了Bootstrap在创建按钮、导航和搜索区域等元素时的优势，如自适应性和简化代码。

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

一，Bootstrap是什么？

1.1，Bootstrap诞生于2011年，来自Twitter公司，是目前最受前端框架

1.2，是一个用于快速开发Web应用程序和网站的前端框架

1.3，Bootstrap是基于HTML，CSS，JS的，简单灵活，使得Web开发更加快捷

概述：Bootstrap是一个建立一个页面，就可以在三个终端(pc端，平板，手机)上完美展示的响应式前端框架

二，为什么学习Bootstrap？

2.1，响应式设计(Bootstrap的响应式CSS能够自适应台式机，平板电脑和手机)

2.2，移动设备优先

2.3，浏览器支持上手

2.4，容易上手

三，如何使用

3.1下载Bootstrap库 https://v4.bootcss.com/(Bootstrap管网)

打开官网的时候

3.2点击下载Bootstrap

注意：建议下载Bootstrap源码，因为Bootstrap里面就包含了Bootstrap生产文件

3.3，下载完之后

3.4，解压完之后点开

找到dist点开里面分为CSS和JS

点开CSS之后我们选择用Bootstrap.css

点开js之后，我们选择用bootstrap.js