在制作表单时，不免要做表单验证。同样也需要提供验证状态样式，在Bootstrap框架中同样提供这几种效果。
1、.has-warning:警告状态（黄色）（推荐学习：Bootstrap视频教程）
2、.has-error：错误状态（红色）
3、.has-success：成功状态（绿色）
使用的时候只需要在form-group容器上对应添加状态类名。
<form role="form"><div class="form-group has-success"> <label class="contr...
阅读全文
Bootstrap通过一些简单的 HTML 标签和扩展的类即可创建出不同样式的表单。
Bootstrap提供了多种表单布局，不过我们最常用的就是表单居中，也叫水平表单。
水平表单与其他表单不仅标记的数量上不同，而且表单的呈现形式也不同。（推荐学习：Bootstrap视频教程）
如需创建一个水平布局的表单，请按下面的几个步骤进行：
向父 <form> 元素添加 class .form-horizontal。
把标签和控件放在一个带有 class .form-group 的 <...
阅读全文
推荐教程：Bootstrap教程
为了让 Bootstrap 开发的网站对移动设备友好，确保适当的绘制和触屏缩放，需要在网页的 head 之中添加 viewport meta 标签，如下所示：
<meta name="viewport" content="width=device-width, initial-scale=1.0">
width 属性控制设备的宽度。假设您的网站将被带有不同屏幕分辨率的设备浏览，那么将它设置为 device-width 可以确保它能正确呈现在不同设备上。
i...
阅读全文
推荐教程：Bootstrap教程
1、Bootstrap4 输入框组
我们可以使用 .input-group 类来向表单输入框中添加更多的样式，如图标、文本或者按钮。使用 .input-group-prepend 类可以在输入框的的前面添加文本信息， .input-group-append 类添加在输入框的后面。最后，我们还需要使用 .input-group-text 类来设置文本的样式。
<form> <div class="input-group mb-3"> <div class="input-group-p...
阅读全文
Bootstrap是Twitter推出的一个开源的用于前端开发的工具包，其中中包含了丰富的Web组件，根据这些组件，可以快速的搭建一个漂亮、功能完备的网站。
最近通过了Bootstrap中文网学习了其中的一些的用法，深深被他简易用法，逻辑清晰，优雅界面所吸引。但是通过教程只能简单地理解其中的基本用法，但对于构建一些商业级的应用还是有一定距离。尤其对于我们这些开发人员来说，我们可能更需要的是获得更多的完整案例来作为参考，构...
阅读全文
什么是栅格系统
栅格系统是指，将页面布局划分为等宽的列，然后通过列数的定义来模块化页面布局。Bootstrap的栅格系统采用了1-12列的模式，并且通过比例计算来设置你定义的列宽。例如你这一行想要采用两列的布局模式，那么每列的宽度都为外容器的50%，不管你用什么设备浏览，它都会采用这样的比例进行展示。不过如果当设备宽度小于你设定的最小宽度，那么这两列就会并排成为一列。
Bootstrap的栅格系统
在Bootstrap中使用栅格...
阅读全文
今天被问了一个问题：”有没有想过为什么Bootstrap要默认是12列？“
用了Bootstrap一段时间，的确没想过为什么要默认是12列。（推荐学习：Bootstrap视频教程）
觉得是因为布局比较方便，常见的分2块，3块，4块都可以方便分完。
既然有假设，那还是要求证一下。
谷歌上一阵搜索。
Contrary to the question’s parenthetical, Bootstrap was always at 940px wide, and not 960px, even with the original 16 columns. With the s...
阅读全文
推荐教程：layui教程
layui分页官方地址:https://www.layui.com/doc/modules/laypage.html
第一步 页面引入layui的css和js
这不就不用演示了吧
第二步 在html中写入样式
第三步 写js代码
目前就是简单的把分页样式写在了js代码中
theme就是给分页自定义颜色或者加一个类名从而改变分页样式
详见layui官网
第四步 ajax控制分页
ajax中data要传的数据
在layui调用中添加 jump
jump就是 点击上一...
阅读全文
复选框（Checkbox）
当创建表单时，如果您想让用户从列表中选择若干个选项时，请使用checkbox。（推荐学习：Bootstrap视频教程）
对一系列复选框使用 .checkbox-inline ，控制它们显示在同一行上。
复选框，可以设置 <div> 为父元素，类为 .custom-control 和 .custom-checkbox，复选框作为子元素放在该 <div> 里头，然后复选框设置为 type="checkbox"，类为 .custom-control-input。
复选框的文本使用 ...
阅读全文
先来看看bootstrap自定义的文本颜色是什么样的：
代码：（推荐学习：Bootstrap视频教程）
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 上述3个meta标签*必须*放在最前...
阅读全文