bootstrap主要是什么


本文摘自PHP中文网,作者藏色散人,侵删。

bootstrap主要是什么

Bootstrap主要是一个用于快速开发 Web 应用程序和网站的前端框架。

在现代 Web 开发中,有几个几乎所有的 Web 项目中都需要的组件。

Bootstrap 为您提供了所有这些基本的模块 - Grid、Typography、Tables、Forms、Buttons 和 Responsiveness。

此外,还有大量其他有用的前端组件,比如 Dropdowns、Navigation、Modals、Typehead、Pagination、Carousal、Breadcrumb、Tab、Thumbnails、Headers 等等。

有了这些,你可以搭建一个 Web 项目,并让它运行地更快速更轻松。

此外,由于整个框架是基于模块的,您可以通过您自己的 CSS 位,甚至是项目开始后的一个大整改,来进行自定义。

上述太官方

Bootstrap是一个做网页的框架(目前最流行的WEB前端框架之一),就是说你只需要写HTML标签调用它的类你就可以很快速的做一个高大上的网页,你不用担心兼容问题,提供了很多样式供你选择!

比如你需要做一个网站的文本显示对吧,你自己写的话你需要写很多代码,但是如果你使用bootstrap框架来写的话,只需要写好HTML标签然后调用类名就可以了!代码展示如下:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>Bootstrap 实例 - 强调</title>

<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css"

<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

</head>

<body>

  

<small>本行内容是在标签内</small><br>

<strong>本行内容是在标签内</strong><br>

<em>本行内容是在标签内,并呈现为斜体</em><br>

<p class="text-left">向左对齐文本</p>

<p class="text-center">居中对齐文本</p>

<p class="text-right">向右对齐文本</p>

<p class="text-muted">本行内容是减弱的</p>

<p class="text-primary">本行内容带有一个 primary class</p>

<p class="text-success">本行内容带有一个 success class</p>

<p class="text-info">本行内容带有一个 info class</p>

<p class="text-warning">本行内容带有一个 warning class</p>

<p class="text-danger">本行内容带有一个 danger class</p>

  

</body>

</html>

效果如下:

fae858cf789b229dc26d291572fc569.png

作用:

用它提供的样式和组件快速写网站

你只需要引用一些定义好的类,也就是class名字,就可以创建出已经有非常漂亮的样式的网页,而且支持自适应,是一个很不错的框架。

简而言之:你只需要了解相关的class、标签名称等所代表的意思,然后在构建页面的时候,导入bootstrap的JS、css等,它就会去表现相应的效果出来。

相关推荐:《bootstrap教程》

以上就是bootstrap主要是什么的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

如何利用bootstrap分页

bootstrap 怎么关闭弹出框

bootstrap整体架构包含哪些模块

bootstrap如何读

vue cli3引入bootstrap的方法介绍

bootstrap框架是什么意思

bootstrap的栅格系统是什么?栅格系统详解

什么是bootstrap?它有什么作用

bootstrap做的网站有哪些

bootstrap弹窗代码写在哪里

更多相关阅读请进入《bootstrap》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...