简介,布局容器,栅格系统,排版,对齐,表格,表单

发布时间 2023-07-25 15:28:31作者: 毓见

Bootstarp简介

简洁、直观、强悍的前端开发框架,让web开发更迅速、简单。

我们使用bootstrap库可以很方便的写一些好看的样式,他的内部给我们封装了很多很多的css样式和一些非常好的js事件,以后我们只需要把他的类库文件引入到我们的文档中就能使用

我们在使用的过程中,只需要通过增加和删除class属性值就能够达到某种特殊效果

如何使用:https://www.bootcss.com/在百度中搜索

bootstrap的版本:v3、v4、v5我们推荐使用v3就行

v3版本依赖 jQuery,v4、v5版本不依赖jQuery

如何使用

# 下载bootstrap的类库文件
# 使用CDN

"""要想使用bootstrap有两部分,css部分,js部分"""
# 如果你只想使用css样式,那么,你就只引入css文件即可
# 如果你想使用它提供的一些动作,就需要引入外部的js文件
# 你在引入js文件的时候,一定要先引入jQuery文件,bootstrap的js文件是依赖于jQuery的js
# 在v3版本,在v4、v5版本就不需要了

Normalize.css

# 一个CSS 重置样式库。

布局容器

<div class="container c1">

</div>

<div class="container-fluid c1">

</div>

# 以后我在写页面的时候,会上来就是一个div然后加一个class=container

栅格系统


排版


对齐


表格

table table-bordered table-striped table-hover

表单