Day26 如何使用bootstrap
首先，到Bootstrap官网的Documentation(Docs)里，点选download，找到Bootstrap的CDN，复制下来贴到你编辑器
我这边提供一个中文版网站：bootStrap
下载解压缩档
bootStrap必须依赖jquery.min.js的存在，所以js也是要一起下载的，jquery
把外部档案引入工程里面
把bootStrap的css、font、js、下载的jquery.min.js一并复制到专案下面，我这边使用的是myelispe
再来需要设定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 显而易见这是一个按钮样式
border-color: #ccc;
}
.btn-default .badge {
color: #fff;
background-color:#333;
}
.btn-primary {
color: #fff;
background-color: #337ab7;
border-color: #2e6da4;
}
.btn-primary:focus,
.btn-primary.focusp {
color: #fff;
background-color: #286090;
border-color: #122640;
}
.btn-primary:hover {
color: #fff;
background-color: #286090;
在jsp页面写上
<body>
<button class="btn-primary">按钮</button>
</body>
呈现出的效果会是
重新整理页面後，将会看到一个蓝色的按钮。不需要自己写一行 CSS 程序码，只要在页面里面给某个元素指定一个 class ，就可以直接显示出预定的样式—。
>>: JavaScript Day25 - Promise(2)
人脸辨识的流程--人脸识别
人脸辨识系统有三个步骤，人脸侦测、特徵撷取、人脸识别。 人脸识别(Face recognition)...
Use Cisco CCIE 350-701 Dumps For Instant Success
Use Actual Cisco 350-701 Dumps to Learn Faster Pas...
LeetCode解题 Day21
485. Max Consecutive Ones https://leetcode.com/pro...
18.unity实例化(上)(Instantiate)
Instantiate实例化，用於将物件生成至场景中。(参考unity手册) 适合用在复制一样的物件...
桦泽紫苑：The power of input
缘起与目标 第 1 天的 exercise，首先帮自己制定目标，由於接下来刚好是周末，我想要思考一个...