bootstrap框架基础知识点整理
2024-06-09 04:15:42
bootstrap框架
- 基本模板及代码注释
- 视口设置
- 布局容器
- 布局容器之container
- 布局容器2---container-fluid
- 栅格系统
- 栅格系统的特点和案例
- 注意点
- 栅格屏幕尺寸设置----响应式开发
- 多个屏幕尺寸共同设置
- 方法1：
- 方法2
- 栅格系统列偏移
- 列表
- 内联列表
- 按钮
- 按钮尺寸设置
- 激活状态
- button 元素
- 链接（< a >）元素
- 禁用状态
- button 元素
- 链接（< a >）元素
- 导航条
- 反色导航条
- 轮播图
- 定时切换轮播图
- 注意: 多个轮播图必须修改轮播图的ID
- 排版-对齐方式
- 表单元素
- 表单校验
- 分页条
- 分页条激活状态
- 禁用状态
基本模板及代码注释
<!doctype html>
<html lang="zh-CN"><!--当前html页面使用中文简体--><head><meta charset="utf-8"><!--设置html页面的字符集--><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--使用IE最新的渲染模式，展示页面--><meta name="viewport" content="width=device-width, initial-scale=1"><!--viewport:视口，浏览器网页上的可视区域视口作用:用于移动设备将大型页面进行比例缩放演示以下设置只在移动设备上生效width=device-width:设置视口的宽度 device-width:设备宽度initial-scale=1:初始化缩放设置 移动设备打开网页时的缩放级别 100% 正常1~5--><!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ --><title>Bootstrap 101 Template</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><h1>你好，世界！</h1><!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --><script src="../js/jquery-1.11.3.min.js"></script><!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 --><script src="../js/bootstrap.min.js"></script></body>
</html>
视口设置
视口常见的设置:
布局容器
布局容器帮助手册网址链接
注意: 任意元素使用了布局容器的样式，都会称为布局容器，建议使用div作为布局容器
布局容器之container
特点： 居中，两端有留白
代码:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><!--布局容器1： container--><div class="container" style="border: 3px solid red;">11111</div><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
布局容器2—container-fluid
特点: 占据了视口100%的宽度
代码:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><!--布局容器2： container-fluid --><div class="container-fluid" style="border: 3px solid red;">11111</div><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
栅格系统
栅格系统帮助文档链接
栅格系统的特点和案例
案例演示:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><!--定义一个布局容器--><div class="container"><!--在布局容器中定义一行--><div class="row"><!--在行上，定义列--><!--lg是当前pc屏幕尺寸，是固定的--><div class="col-lg-2" style="border: solid 2px red;">当前元素占两列</div><div class="col-lg-4" style="border: solid 2px red;">当前元素占四列</div><div class="col-lg-4" style="border: solid 2px red;">当前元素占六列</div></div></div><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
注意点
- 列元素的书写顺序，决定布局顺序，先写的列元素会被先布局到行上
- 列元素的占用列数，定义列元素的大小
- 如果列元素的占用列数，总和小于等于12，这些列元素还排列在一行上
- 如果列元素的占用列数，总和大于等于12，大于12的列元素会另起一行排列
- 栅格是可以进行无限嵌套的： 行----列----行—列…
- 一行有十二列，指的是一个row元素下有十二列
栅格屏幕尺寸设置----响应式开发
屏幕尺寸简述:
- large: lg -----大屏幕，一般的pc尺寸
- medium: md -----中等屏幕，小pc尺寸
- small: sm ------小屏幕,ipad尺寸
- x small: xs -----超小屏幕，智能手机屏幕
如果没有设置当前屏幕的样式，默认一个元素占据一行
设置为xs时:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><div class="container"><div class="row"><div class="col-xs-4" style="border: solid 2px red;">当前元素占两列</div><div class="col-xs-4" style="border: solid 2px red;">当前元素占四列</div><div class="col-xs-4" style="border: solid 2px red;">当前元素占六列</div></div></div><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
多个屏幕尺寸共同设置
方法1：
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-4" style="border: solid 2px red;">
完整代码演示:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><div class="container"><div class="row"><div class="col-lg-4 col-md-4 col-sm-4 col-xs-4" style="border: solid 2px red;">当前元素占四列</div><div class="col-lg-4 col-md-4 col-sm-4 col-xs-4" style="border: solid 2px red;">当前元素占四列</div><div class="col-lg-4 col-md-4 col-sm-4 col-xs-4" style="border: solid 2px red;">当前元素占四列</div></div></div><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
方法2
如果设置了一个屏幕尺寸，比这个屏幕尺寸大的屏幕，继承当前的设置
比这个屏幕小的尺寸，默认一个元素占一行
代码演示:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><div class="container"><div class="row"><div class="col-xs-4" style="border: solid 2px red;">当前元素占四列</div><div class="col-xs-4" style="border: solid 2px red;">当前元素占四列</div><div class="col-xs-4" style="border: solid 2px red;">当前元素占四列</div></div></div><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
栅格系统列偏移
列偏移帮助文档链接
代码演示:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><div class="container"><div class="row"><div class="col-xs-4 col-xs-offset-4" style="border: solid 2px red;">当前元素占四列,列偏移4</div></div></div><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body></body>
</html>
列表
内联列表
内联列表帮助文档链接
内联元素: 位于一行上，元素结束时，不会自动换行
代码演示:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body>
<ul class="list-inline"><li>大忽悠</li><li>小朋友</li><li>大朋友</li></ul><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body></body>
</html>
按钮
按钮帮助文档链接
注意: 任何html元素加上按钮样式都会变成对应按钮
代码演示:
<button type="button" class="btn btn-default">（默认样式）Default</button>
<button type="button" class="btn btn-primary">（首选项）Primary</button>
<button type="button" class="btn btn-success">（成功）Success</button>
<button type="button" class="btn btn-info">（一般信息）Info</button>
<button type="button" class="btn btn-warning">（警告）Warning</button>
<button type="button" class="btn btn-danger">（危险）Danger</button>
<button type="button" class="btn btn-link">（链接）Link</button>
按钮尺寸设置
需要让按钮具有不同尺寸吗？使用 .btn-lg、.btn-sm 或 .btn-xs 就可以获得不同尺寸的按钮。
代码演示:
<p><button type="button" class="btn btn-primary btn-lg">（大按钮）Large button</button><button type="button" class="btn btn-default btn-lg">（大按钮）Large button</button>
</p>
<p><button type="button" class="btn btn-primary">（默认尺寸）Default button</button><button type="button" class="btn btn-default">（默认尺寸）Default button</button>
</p>
<p><button type="button" class="btn btn-primary btn-sm">（小按钮）Small button</button><button type="button" class="btn btn-default btn-sm">（小按钮）Small button</button>
</p>
<p><button type="button" class="btn btn-primary btn-xs">（超小尺寸）Extra small button</button><button type="button" class="btn btn-default btn-xs">（超小尺寸）Extra small button</button>
</p>
激活状态
当按钮处于激活状态时，其表现为被按压下去（底色更深、边框夜色更深、向内投射阴影）。对于 <button> 元素，是通过 :active 状态实现的。对于 <a> 元素，是通过 .active 类实现的。然而，你还可以将 .active 应用到 上（包含 aria-pressed="true" 属性)），并通过编程的方式使其处于激活状态。
button 元素
由于 :active 是伪状态，因此无需额外添加，但是在需要让其表现出同样外观的时候可以添加 .active 类。
代码演示:
<button type="button" class="btn btn-primary btn-lg active">Primary button</button>
<button type="button" class="btn btn-default btn-lg active">Button</button>
链接（< a >）元素
可以为基于 <a> 元素创建的按钮添加 .active 类。
代码演示:
<a href="#" class="btn btn-primary btn-lg active" role="button">Primary link</a>
<a href="#" class="btn btn-default btn-lg active" role="button">Link</a>
禁用状态
通过为按钮的背景设置 opacity 属性就可以呈现出无法点击的效果。
button 元素
为 <button> 元素添加 disabled 属性，使其表现出禁用状态。
代码演示：
<button type="button" class="btn btn-lg btn-primary" disabled="disabled">Primary button</button>
<button type="button" class="btn btn-default btn-lg" disabled="disabled">Button</button>
链接（< a >）元素
为基于 <a> 元素创建的按钮添加 .disabled 类。
该写法图标变为灰色，鼠标放上去没有禁止点击的标记:
<a href="#" class="btn btn-primary btn-lg disabled" role="button">Primary link</a>
<a href="#" class="btn btn-default btn-lg disabled" role="button">Link</a>
另一种写法,鼠标放入图标后，有禁止点击的标记
<a href="#" class="btn btn-primary btn-lg" disabled="disabled">Primary link</a>
<a href="#" class="btn btn-default btn-lg" disabled="disabled">Link</a>
导航条
导航条帮助文档链接
反色导航条
代码演示:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><!--导航条--><nav class="navbar navbar-inverse"><div class="container-fluid"><!-- 导航图标，汉堡按钮 --><div class="navbar-header"><button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"><!--sr-only阅读器专用--><span class="sr-only">这是汉堡按钮</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a class="navbar-brand" href="#">Brand</a></div><!-- 导航主体部分 --><div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><ul class="nav navbar-nav"><li class="active"><a href="#">大忽悠个人主页 <span class="sr-only">(current)</span></a></li><li><a href="#">大忽悠军团</a></li><!--下拉菜单--><li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">更多 <span class="caret"></span></a><ul class="dropdown-menu"><li><a href="#">爱好</a></li><li><a href="#">特长</a></li><li><a href="#">财富</a></li><!--分割线--><li role="separator" class="divider"></li><li><a href="#">经历</a></li><li role="separator" class="divider"></li><li><a href="#">学校</a></li></ul></li></ul><!--让提交部分的表单，靠右排列--><form class="navbar-form navbar-right"><div class="form-group"><input type="text" class="form-control" placeholder="Search"></div><button type="submit" class="btn btn-default">Submit</button></form></nav><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
轮播图
轮播图帮助文档链接
代码演示:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><!-- 轮播图 --><div id="carousel-example-generic" class="carousel slide" data-ride="carousel"><!-- 小圆点 --><ol class="carousel-indicators"><li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li><li data-target="#carousel-example-generic" data-slide-to="1"></li><li data-target="#carousel-example-generic" data-slide-to="2"></li><li data-target="#carousel-example-generic" data-slide-to="3"></li></ol><!-- 轮播图 图片主体部分 --><div class="carousel-inner" role="listbox"><div class="item active"><img src="../funImage/1.jpg"/><div class="carousel-caption">图片1的说明信息</div></div><div class="item"><img src="../funImage/2.jpg"/><div class="carousel-caption">图片2的说明信息</div></div><div class="item"><img src="../funImage/3.jpg"/><div class="carousel-caption">图片3的说明信息</div></div><div class="item"><img src="../funImage/bartlesvillecf.jpg"/><div class="carousel-caption">图片4的说明信息</div></div></div><!-- 左右控制按钮 --><a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span><span class="sr-only">Previous</span></a><a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span><span class="sr-only">Next</span></a></div><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
定时切换轮播图
轮播图DIV定时换图属性:
data-interval : 毫秒值
代码演示:
<!-- 轮播图 --><div id="carousel-example-generic" class="carousel slide" data-ride="carousel" data-interval="1000">
注意: 多个轮播图必须修改轮播图的ID
同时也要修改小圆点控制的轮播图id和左右按钮控制的轮播图id
代码演示:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><!-- 轮播图2 --><div id="lbt1" class="carousel slide" data-ride="carousel" data-interval="3000"><!-- 小圆点 --><ol class="carousel-indicators"><li data-target="#lbt1" data-slide-to="0" class="active"></li><li data-target="#lbt1" data-slide-to="1"></li><li data-target="#lbt1" data-slide-to="2"></li><li data-target="#lbt1" data-slide-to="3"></li></ol><!-- 轮播图 图片主体部分 --><div class="carousel-inner" role="listbox"><div class="item active"><img src="../funImage/1.jpg"/><div class="carousel-caption">图片1的说明信息</div></div><div class="item"><img src="../funImage/2.jpg"/><div class="carousel-caption">图片2的说明信息</div></div><div class="item"><img src="../funImage/3.jpg"/><div class="carousel-caption">图片3的说明信息</div></div><div class="item"><img src="../funImage/bartlesvillecf.jpg"/><div class="carousel-caption">图片4的说明信息</div></div></div><!-- 左右控制按钮 --><a class="left carousel-control" href="#lbt1" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span><span class="sr-only">Previous</span></a><a class="right carousel-control" href="#lbt1" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span><span class="sr-only">Next</span></a></div><!-- 轮播图2 --><div id="lbt2" class="carousel slide" data-ride="carousel" data-interval="3000"><!-- 小圆点 --><ol class="carousel-indicators"><!--小圆点控制的轮播图id也要修改--><li data-target="#lbt2" data-slide-to="0" class="active"></li><li data-target="#lbt2" data-slide-to="1"></li><li data-target="#lbt2" data-slide-to="2"></li><li data-target="#lbt2" data-slide-to="3"></li></ol><!-- 轮播图 图片主体部分 --><div class="carousel-inner" role="listbox"><div class="item active"><img src="../funImage/1.jpg"/><div class="carousel-caption">图片1的说明信息</div></div><div class="item"><img src="../funImage/2.jpg"/><div class="carousel-caption">图片2的说明信息</div></div><div class="item"><img src="../funImage/3.jpg"/><div class="carousel-caption">图片3的说明信息</div></div><div class="item"><img src="../funImage/bartlesvillecf.jpg"/><div class="carousel-caption">图片4的说明信息</div></div></div><!-- 左右控制按钮 --><!--左右按钮控制的轮播图id也要修改--><a class="left carousel-control" href="#lbt2" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span><span class="sr-only">Previous</span></a><a class="right carousel-control" href="#lbt2" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span><span class="sr-only">Next</span></a></div><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
排版-对齐方式
排版–对齐帮助文档链接
代码演示:
<div class="text-center">大忽悠和小朋友<img src="../funImage/我他妈直接拒绝.jpg"/></div>
表单元素
表单帮助文档链接
水平排列的表单代码演示:
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>模板1</title><link href="../css/bootstrap.min.css" rel="stylesheet"></head><body><form class="form-horizontal"><div class="form-group"><label class="col-sm-2 control-label">用户名</label><div class="col-sm-5"><!--placeholder:替代文字--><input type="text" class="form-control" placeholder="请输入用户名"></div></div><div class="form-group"><label class="col-sm-2 control-label">密码</label><div class="col-sm-5"><input type="password" class="form-control" placeholder="请输入密码"></div></div><div class="form-group"><div class="col-sm-offset-2 col-sm-10"><div class="checkbox"><label><input type="checkbox"> 记住我</label></div></div></div><div class="form-group"><div class="col-sm-offset-2 col-sm-10"><button type="submit" class="btn btn-default">提交</button></div></div></form><script src="../js/jquery-1.11.3.min.js"></script><script src="../js/bootstrap.min.js"></script></body>
</html>
表单校验
表单校验帮助文档链接
代码演示:
<div class="form-group has-error"><div class="form-group has-success">
分页条
分页条帮助文档链接
代码演示:
<nav aria-label="Page navigation"><!--分页条整体列表--><ul class="pagination"><!--上一页--><li><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li><!--索引页--><li><a href="#">1</a></li><li><a href="#">2</a></li><li><a href="#">3</a></li><li><a href="#">4</a></li><li><a href="#">5</a></li><!--下一页--><li><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li></ul></nav>
分页条激活状态
代码演示:
<li class="active"><a href="#">1</a></li>
禁用状态
代码演示:
<!--上一页--><li class="disabled">
对应设置了不可用里面的a标签的herf属性，最好删掉，这样用户点击之后也不会再跳转了。
bootstrap框架基础知识点整理相关推荐
- python基础知识整理-python爬虫基础知识点整理
首先爬虫是什么? 网络爬虫(又被称为网页蜘蛛,网络机器人,在FOAF社区中间,更经常的称为网页追逐者),是一种按照一定的规则,自动的抓取万维网信息的程序或者脚本. 根据我的经验,要学习Python爬虫 ...
- python基础知识500题_python爬虫基础知识点整理
更多编程教程请到:菜鸟教程 https://www.piaodoo.com/ 友情链接: 高州阳光论坛https://www.hnthzk.com/ 人人影视http://www.sfkyty.com ...
- Java基础知识点整理（2022年最新版）
看了网上很多关于Java基础知识点整理的文章,但是感觉都不是很好,要么不全面,要么不准确,要么排版太乱了,所以今天整理了一份Java基础知识点整理(2022年最新版),希望对大家有帮助哈~ 由于本文篇 ...
- python爬虫基础知识点整理
更多编程教程请到:菜鸟教程 https://www.piaodoo.com/ 友情链接: 高州阳光论坛https://www.hnthzk.com/ 人人影视http://www.sfkyty.com ...
- mysql 存储引擎 面试_搞定PHP面试 - MySQL基础知识点整理 - 存储引擎
MySQL基础知识点整理 - 存储引擎 0. 查看 MySQL 支持的存储引擎 可以在 mysql 客户端中,使用 show engines; 命令可以查看MySQL支持的引擎: mysql> ...
- java重要基础知识点_java基础知识点整理
该楼层疑似违规已被系统折叠 隐藏此楼查看此楼 java基础知识点整理1.&和&&的区别? &:逻辑与(and),运算符两边的表达式均为true时,整个结果才为true. ...
- 百度 java基础_java基础知识点整理
该楼层疑似违规已被系统折叠 隐藏此楼查看此楼 java基础知识点整理1.&和&&的区别? &:逻辑与(and),运算符两边的表达式均为true时,整个结果才为true. ...
- java基础知识点整理一
java基础知识点整理一 引言 '''突然发觉任何一门语言的基础知识部分,都比较杂一些.如果个人经过梳理之后,知识体系系统化,可以让基础更加牢靠一些.但是还是会有一些遗忘.所以,我想把一些比较重要但是 ...
- bootstrap框架基础使用
bootstrap框架基础使用 bootstrap简介 bootstrap引入和使用 网络引用 本地引用 bootstrap基础 bootstrap组成 bootstrap组件 bootstrap简介 ...
最新文章
- python自学什么书比较好-19年学习Python有什么好的书籍推荐吗?
- java中删除每一条数据,一条sql语句删除表中所有除ID 不同之外的记录，只留一条。...
- 随机猜拳判断胜利（思路，逻辑正确不完美）if switch
- ASP.NET Core 中文文档 第三章 原理（13）管理应用程序状态
- 线段树求区间最大值RMQ(单点更新)
- StringBuilder字符串缓冲区
- P4287-[SHOI2011]双倍回文【PAM】
- 永洪报表工具_2020年最值得推荐的五大BI工具
- python 获取向上两级路径_Python学习第171课--相对路径和绝对路径
- 基于linux的电子邮件服务(sendmail)
- SwitchHost常见问题解决
- 解决方案-电子签章：金格科技
- 我拍了拍Redis，被移出了群聊···
- regester正则用法_Regester(正则表达式测试器)官方版
- 【Flink】（03）Apache Flink 漫谈系列 —— Flink 1.11 Unaligned Checkpoint 解析
- Arduino Leonardo教程：如何回车，特殊按键定义，DIY超便宜的键盘主控
- 自己做量化交易软件(1)通通量化分析环境安装使用
- 共识算法 —— PoA
- 代数系统，二元运算，半群，含幺半群，群
- mysql 错误 #2054 解决方案