什么是bootstrap

以下为学做网站论坛关于“什么是bootstrap”讲解视频教程。

什么是bootstrap

Bootstrap是一个做网页的框架（目前特别流行的WEB前端框架之一），是一种自适应网站框架，我们制作自适应手机网站就需要学习Bootstrap。

我们使用Bootstrap时，只需要写HTML标签调用它的类你就可以很快速的做一个高大上的网页，不用担心兼容问题，并且它提供了很多样式供你选择！

比如我们想控制一个网站的文本显示格式，我们需要自己写很多的代码来控制它，但如果使用Bootstrap，它已经帮我们写好了样式，我们只需要直接拿来使用就可以了。

什么是bootstrap

Bootstrap有什么用？

bootstrap是一个做网页的框架（目前特别流行的WEB前端框架），就是说你只需要写HTML标签调用它的类你就可以很快速的做一个高大上的网页，你不用担心兼容问题，提供了很多样式供你选择！

比如你需要做一个网站的导航对吧，你自己写的话你需要写很多代码，但是如果你使用bootstrap框架来写的话，只需要写好HTML标签然后调用类名就可以了！

bootstrap怎么使用

第一步、https://v3.bootcss.com/getting-started/#download 官网下载解压缩

这个bootStrap必须依赖jquery.min.js的存在，所以一并下载这个js

第二步、把外部文件引入工程里面

把bootStrap的css、font、js、下载的jquery.min.js一并复制到项目下面

第三步、jsp页面设置如下

注意这几个文件的前后顺序，如果不对，会导致页面无法正常运行。

先引入 bootstrap.min.css （Bootstrap的样式表文件）
然后引入自己写的 css 文件（style.css）
然后引入 jQuery（javascript 库）
最后引入 bootstrap.min.js 程序文件


<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<!--这个lang="zh-CN"是转化为html5的版本 -->

<html lang="zh-CN">

<head>

<base href="<%=basePath%>">

<title>学习bootstrap案例</title>

<!-- 这个是自适应各种分辨率的屏幕 -->

<meta name="viewport" content="width=device-width, initial-scale=1">



<meta http-equiv="pragma" content="no-cache">

<meta http-equiv="cache-control" content="no-cache">

<meta http-equiv="expires" content="0">

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

<meta http-equiv="description" content="This is my page">

<link rel="stylesheet" href="css/bootstrap.min.css"/>

<link rel="stylesheet" href="css/style.css"/>

<script src="js/jquery-3.3.1.min.js"></script>

<script src="js/bootstrap.min.js"></script>



</head>

第三步、使用bootStrap的样式表，

bootstrap强大之处，在于，别人都设计好了的功能，你只需要熟悉别人的规则就可以直接使用！

小例子：

打开样式表bootstrap.css，你可以看到如下.btn-primary 显而易见这是一个按钮样式

在jsp页面写上


<body>

<button class="btn-primary">按钮</button>

</body>

刷新页面，你会看到一个蓝色的按钮。不需要自己写一行 CSS 代码，只要在页面里面给某个元素指定一个 class ，就可以直接显示出预定的样式—— 这就是使用 Bootstrap 前端框架的魔力。

零基础学做网站论坛

当前位置：

什么是bootstrap