关于Bootstrap的初探索

8 篇文章 0 订阅

我们在运用Bootstrap这个框架时,首先要去了解它的稳定版本以及现在的通用版本,目前很多解说视频都是推荐使用Bootstrap3版本。
在这里插入图片描述这是下载到电脑上的三个文件夹,里面还有几个对应的文件。
今天我们说一下如何将其引入进自己所需的html文件中
在这里插入图片描述第一行代码是引入Bootstrap中的css文件,也就是css文件夹下的一个后缀为.css的一个文件,相当于引入一个外部的css代码库。当然这些都是别人给你整理好的。
第二行是引入Bootstrap所要依赖的jQuery插件。因为Bootstrap的所有插件都要依赖jQuery,在引入插件之前,必须先引入jQuery。我们可以将这个插件下载到本地,也可以直接将它从网上获取,实际上其他两个也是。
第三行是引入Bootstrap中的js文件。也就是js文件夹下的一个后缀为.js的一个文件,相当于引入一个外部的js代码库。

实例一:从做一个响应式的表格开始。
在这里插入图片描述我们在body标签里面写了一个表格,然后给它最大的父级加了.container这个类名,而他下一级给的是.row这个类名,我们可以从引入的css代码库中看到,在这里插入图片描述它本身就已经给我们写好了媒体查询的要求,所以它会在网页上产生响应式的变化。
PC端:
在这里插入图片描述移动端:
在这里插入图片描述在这里插入图片描述

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值