BootStrap案例CRM管理系统-前端概述

已于 2022-11-15 17:16:03 修改
阅读量772 收藏
点赞数
分类专栏： BootStrap案例CRM管理系统 文章标签： bootstrap javascript 前端
于 2022-11-08 14:22:14 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhoutao_88/article/details/127749946
版权

一、项目准备工作

1.1、添加依赖

boostrap依赖、jQuery依赖、vue的依赖

<!-- 导入bootstrap依赖 -->
    <link rel="stylesheet" href="assets/bootstrap-3.3.7-dist/css/bootstrap.min.css"/>
    <script src="assets/jquery-3.5.1/jquery-3.5.1.min.js"></script>
    <script src="assets/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <!--导入Vue依赖-->
    <script src="assets/vue.min-v2.5.16.js"></script>
    <script src="assets/axios.min.js"></script>

1.2、项目中用到的图片资源

 二、前端开发

2.1、登录页面开发

创建login.html, 并导入依赖(bootstrap、vue)

源代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <!-- 导入bootstrap依赖 -->
    <link rel="stylesheet" href="assets/bootstrap-3.3.7-dist/css/bootstrap.min.css"/>
    <script src="assets/jquery-3.5.1/jquery-3.5.1.min.js"></script>
    <script src="assets/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <!--导入Vue依赖-->
    <script src="assets/vue.min-v2.5.16.js"></script>
    <script src="assets/axios.min.js"></script>
</head>
<body>
    <div class="container" id="app">
        <div class="row">
            <div class="col-md-6 col-md-offset-3" style="height: 310px;border: 1px solid black;margin-top: 80px">
                <div class="row">
                    <div class="col-md-5" style="height: 310px;background-color: rgb(43,136,223);font-size: 18px;color: white;font-weight: bold;text-align: center;line-height: 310px">
                        蜗牛CRM管理系统
                    </div>
                    <div class="col-md-7">
                        <div class="row" style="padding: 30px 0px 30px 0px;">
                            <div class="col-md-12" style="text-align: center;font-size: 18px;font-weight: bold">
                                登录
                            </div>
                        </div>
                        <div class="row" style="height: 60px;margin-bottom: 20px;">
                            <div class="col-md-8 col-md-offset-2">
                                <label>用户名</label>
                                <input type="text" class="form-control">
                            </div>
                        </div>
                        <div class="row" style="height: 60px;margin-bottom: 20px;">
                            <div class="col-md-8 col-md-offset-2">
                                <label>密码</label>
                                <input type="password" class="form-control">
                            </div>
                        </div>
                        <div class="row" style="height: 60px;margin-bottom: 20px;">
                            <div class="col-md-8 col-md-offset-2" style="text-align: center">
                                <button class="btn btn-primary" style="margin-right: 8px">登录</button>
                                <button class="btn btn-default">重置</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>


</body>
</html>

2.2、首页开发

创建index.html,并导入依赖(bootsteap、vue)

源代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <!-- 导入bootstrap依赖 -->
    <link rel="stylesheet" href="assets/bootstrap-3.3.7-dist/css/bootstrap.min.css"/>
    <script src="assets/jquery-3.5.1/jquery-3.5.1.min.js"></script>
    <script src="assets/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <!--导入Vue依赖-->
    <script src="assets/vue.min-v2.5.16.js"></script>
    <script src="assets/axios.min.js"></script>
    <style>
        a:link{font-size: 20px;color: rgb(109,109,109);}
        a:visited{font-size: 20px;color: rgb(109,109,109);}
        a:hover{font-size: 20px;color: white;text-decoration: none}
    </style>
</head>
<body>
    <div class="container" id="app">
        <div class="row">
            <!--显示导航-->
            <div class="col-md-3" style="background-color: rgb(0,21,41);height: 800px;">
                <div class="row">
                    <div class="col-md-12" style="background-color: rgb(0,40,77);text-align: center;height: 70px;line-height: 70px;font-size: 20px;color: white;font-weight: bold;">
                       <img src="assets/img/logo.png" style="width: 30px;height: 30px;margin-right: 8px;"/>
                        蜗牛CRM管理系统
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                        <a href="index.html">进入首页</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                        <a href="user_list.html">用户管理</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                        <a href="user_add.html">添加用户</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                        <a href="#">客户管理</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                        <a href="#">添加客户</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                        <a href="user_upadte.html">修改密码</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                        <a href="#">退出登录</a>
                    </div>
                </div>
            </div>
            <!--显示内容-->
            <div class="col-md-9" style="border: 1px solid gray;height: 800px;">
                <!-- 显示提示内容 -->
                <div class="row">
                    <div class="col-md-12" style="height: 70px;font-size: 18px;color: rgb(109,109,109);line-height: 70px;font-weight: bold;padding-left: 20px">
                        > &nbsp;&nbsp;首页
                    </div>
                </div>
                <!-- 显示内容 -->
                <div class="row">
                    <div class="col-md-12" style="background-color: rgb(240,242,245); height: 730px;padding: 20px">
                        <img src="assets/img/index.png" class="img-responsive center-block"/>
                    </div>
                </div>
            </div>

        </div>

    </div>

</body>
</html>

2.3、用户管理页面效果

创建user_list.html，并导入依赖（bootstrap、vue）

源代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户管理</title>
    <!-- 导入bootstrap依赖 -->
    <link rel="stylesheet" href="assets/bootstrap-3.3.7-dist/css/bootstrap.min.css"/>
    <script src="assets/jquery-3.5.1/jquery-3.5.1.min.js"></script>
    <script src="assets/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <!--导入Vue依赖-->
    <script src="assets/vue.min-v2.5.16.js"></script>
    <script src="assets/axios.min.js"></script>
    <style>
        a:link{font-size: 20px;color: rgb(109,109,109);}
        a:visited{font-size: 20px;color: rgb(109,109,109);}
        a:hover{font-size: 20px;color: white;text-decoration: none}
    </style>
</head>
<body>
<div class="container" id="app">
    <div class="row">
        <!--显示导航-->
        <div class="col-md-3" style="background-color: rgb(0,21,41);height: 800px;">
            <div class="row">
                <div class="col-md-12" style="background-color: rgb(0,40,77);text-align: center;height: 70px;line-height: 70px;font-size: 20px;color: white;font-weight: bold;">
                    <img src="assets/img/logo.png" style="width: 30px;height: 30px;margin-right: 8px;"/>
                    蜗牛CRM管理系统
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="index.html">进入首页</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="user_list.html">用户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="user_add.html">添加用户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="#">客户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="#">添加客户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="user_upadte.html">修改密码</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="#">退出登录</a>
                </div>
            </div>
        </div>
        <!--显示内容-->
        <div class="col-md-9" style="border: 1px solid gray;height: 800px;">
            <!-- 显示提示内容 -->
            <div class="row">
                <div class="col-md-12" style="height: 70px;font-size: 18px;color: rgb(109,109,109);line-height: 70px;font-weight: bold;padding-left: 20px">
                    > &nbsp;&nbsp;用户管理
                </div>
            </div>
            <!-- 显示内容 -->
            <div class="row" style="background-color: rgb(240,242,245); height: 730px;padding: 20px">
                <div class="col-md-12" style="background-color: white;height: 730px;border: none;border-radius: 5px;">
                    <!--使用bootstrap表格斑马线样式-->
                    <table class="table table-striped" style="margin-top: 20px;">
                        <!-- 表格描述 -->
                        <caption>用户管理-用户列表</caption>
                        <thead>
                        <tr>
                            <th>ID</th>
                            <th>用户名</th>
                            <th>昵称</th>
                            <th>性别</th>
                            <th>生日</th>
                            <th>手机号</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <!-- 表格的内容 -->
                        <tbody>
                        <tr>
                            <td>1001</td>
                            <td>zhangsan</td>
                            <td>张三</td>
                            <td>男</td>
                            <td>2000-02-04</td>
                            <td>13838383388</td>
                            <td>
                                <button class="btn btn-link">修改</button>
                                <button class="btn btn-link">删除</button>
                            </td>
                        </tr>
                        <tr>
                            <td>1001</td>
                            <td>zhangsan</td>
                            <td>张三</td>
                            <td>男</td>
                            <td>2000-02-04</td>
                            <td>13838383388</td>
                            <td>
                                <button class="btn btn-link">修改</button>
                                <button class="btn btn-link">删除</button>
                            </td>
                        </tr>
                        <tr>
                            <td>1001</td>
                            <td>zhangsan</td>
                            <td>张三</td>
                            <td>男</td>
                            <td>2000-02-04</td>
                            <td>13838383388</td>
                            <td>
                                <button class="btn btn-link">修改</button>
                                <button class="btn btn-link">删除</button>
                            </td>
                        </tr>
                        <tr>
                            <td>1001</td>
                            <td>zhangsan</td>
                            <td>张三</td>
                            <td>男</td>
                            <td>2000-02-04</td>
                            <td>13838383388</td>
                            <td>
                                <button class="btn btn-link">修改</button>
                                <button class="btn btn-link">删除</button>
                            </td>
                        </tr>
                        <tr>
                            <td>1001</td>
                            <td>zhangsan</td>
                            <td>张三</td>
                            <td>男</td>
                            <td>2000-02-04</td>
                            <td>13838383388</td>
                            <td>
                                <button class="btn btn-link">修改</button>
                                <button class="btn btn-link">删除</button>
                            </td>
                        </tr>
                        <tr>
                            <td>1001</td>
                            <td>zhangsan</td>
                            <td>张三</td>
                            <td>男</td>
                            <td>2000-02-04</td>
                            <td>13838383388</td>
                            <td>
                                <button class="btn btn-link">修改</button>
                                <button class="btn btn-link">删除</button>
                            </td>
                        </tr>
                        <tr>
                            <td>1001</td>
                            <td>zhangsan</td>
                            <td>张三</td>
                            <td>男</td>
                            <td>2000-02-04</td>
                            <td>13838383388</td>
                            <td>
                                <button class="btn btn-link">修改</button>
                                <button class="btn btn-link">删除</button>
                            </td>
                        </tr>
                        </tbody>

                    </table>
                </div>
            </div>
        </div>

    </div>

</div>

</body>
</html>

 2.4、添加用户页面开发

创建user_add.html, 并导入依赖（bootstrap、vue）

源代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>添加用户</title>
    <!-- 导入bootstrap依赖 -->
    <link rel="stylesheet" href="assets/bootstrap-3.3.7-dist/css/bootstrap.min.css"/>
    <script src="assets/jquery-3.5.1/jquery-3.5.1.min.js"></script>
    <script src="assets/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <!--导入Vue依赖-->
    <script src="assets/vue.min-v2.5.16.js"></script>
    <script src="assets/axios.min.js"></script>
    <style>
        a:link{font-size: 20px;color: rgb(109,109,109);}
        a:visited{font-size: 20px;color: rgb(109,109,109);}
        a:hover{font-size: 20px;color: white;text-decoration: none}
    </style>
</head>
<body>
<div class="container" id="app">
    <div class="row">
        <!--显示导航-->
        <div class="col-md-3" style="background-color: rgb(0,21,41);height: 800px;">
            <div class="row">
                <div class="col-md-12" style="background-color: rgb(0,40,77);text-align: center;height: 70px;line-height: 70px;font-size: 20px;color: white;font-weight: bold;">
                    <img src="assets/img/logo.png" style="width: 30px;height: 30px;margin-right: 8px;"/>
                    蜗牛CRM管理系统
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="index.html">进入首页</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="user_list.html">用户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="user_add.html">添加用户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="#">客户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="#">添加客户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="user_upadte.html">修改密码</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="#">退出登录</a>
                </div>
            </div>
        </div>
        <!--显示内容-->
        <div class="col-md-9" style="border: 1px solid gray;height: 800px;">
            <!-- 显示提示内容 -->
            <div class="row">
                <div class="col-md-12" style="height: 70px;font-size: 18px;color: rgb(109,109,109);line-height: 70px;font-weight: bold;padding-left: 20px">
                    > &nbsp;&nbsp;添加用户
                </div>
            </div>
            <!-- 显示内容 -->
            <div class="row" style="background-color: rgb(240,242,245); height: 730px;padding: 20px">
                <div class="col-md-12" style="background-color: white;height: 730px;border: none;border-radius: 5px;">
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 50px">
                            <label>用户名</label>
                            <input type="text" class="form-control"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px">
                            <label>昵称</label>
                            <input type="text" class="form-control"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px">
                            <label>手机号</label>
                            <input type="text" class="form-control"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px">
                            <label>生日</label>
                            <input type="text" class="form-control"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px">
                            <label style="margin-right: 15px">性别</label>
                            <label class="radio-inline">
                                <input type="radio"/>男
                            </label>
                            <label class="radio-inline">
                                <input type="radio"/>女
                            </label>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px;text-align: center">
                            <button class="btn btn-primary" style="margin-right: 8px;">添加</button>
                            <button class="btn btn-default">重置</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>

</div>

</body>
</html>

2.4、修改密码页面开发

创建user_add.html, 并导入依赖（bootstrap、vue）

源代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>修改密码</title>
    <!-- 导入bootstrap依赖 -->
    <link rel="stylesheet" href="assets/bootstrap-3.3.7-dist/css/bootstrap.min.css"/>
    <script src="assets/jquery-3.5.1/jquery-3.5.1.min.js"></script>
    <script src="assets/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <!--导入Vue依赖-->
    <script src="assets/vue.min-v2.5.16.js"></script>
    <script src="assets/axios.min.js"></script>
    <style>
        a:link{font-size: 20px;color: rgb(109,109,109);}
        a:visited{font-size: 20px;color: rgb(109,109,109);}
        a:hover{font-size: 20px;color: white;text-decoration: none}
    </style>
</head>
<body>
<div class="container" id="app">
    <div class="row">
        <!--显示导航-->
        <div class="col-md-3" style="background-color: rgb(0,21,41);height: 800px;">
            <div class="row">
                <div class="col-md-12" style="background-color: rgb(0,40,77);text-align: center;height: 70px;line-height: 70px;font-size: 20px;color: white;font-weight: bold;">
                    <img src="assets/img/logo.png" style="width: 30px;height: 30px;margin-right: 8px;"/>
                    蜗牛CRM管理系统
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="index.html">进入首页</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="user_list.html">用户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="user_add.html">添加用户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="#">客户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="#">添加客户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="user_upadte.html">修改密码</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding: 20px 0px 20px 0px;">
                    <a href="#">退出登录</a>
                </div>
            </div>
        </div>
        <!--显示内容-->
        <div class="col-md-9" style="border: 1px solid gray;height: 800px;">
            <!-- 显示提示内容 -->
            <div class="row">
                <div class="col-md-12" style="height: 70px;font-size: 18px;color: rgb(109,109,109);line-height: 70px;font-weight: bold;padding-left: 20px">
                    > &nbsp;&nbsp;修改密码
                </div>
            </div>
            <!-- 显示内容 -->
            <div class="row" style="background-color: rgb(240,242,245); height: 730px;padding: 20px">
                <div class="col-md-12" style="background-color: white;height: 730px;border: none;border-radius: 5px;">
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 50px">
                            <label>当前密码</label>
                            <input type="text" class="form-control"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px">
                            <label>确认密码</label>
                            <input type="text" class="form-control"/>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px;text-align: center">
                            <button class="btn btn-primary" style="margin-right: 8px;">修改</button>
                            <button class="btn btn-default">重置</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>

</div>

</body>
</html>

周途
关注
专栏目录
《jQuery+BootstrapWeb开发案例教程（在线实训版）》案例源码.zip
06-29
《jQuery+BootstrapWeb开发案例教程（在线实训版）》案例源码.zip
BootSrap案例CRM管理系统-查询所有用户
热爱生活,热爱技术,对未知永远保持好奇!
11-09 294
查询所有用户
Bootstrap后台管理系统设计实战
最新发布
weixin_42360846的博客
08-29 1367
本文还有配套的精品资源，点击获取 简介：Bootstrap是一个广泛使用的前端开发框架，它通过提供丰富的组件和模板简化了响应式网站的构建过程。该项目名为“college_后台bootstrap_bootstrap_”，可能是一个使用Bootstrap创建的教育机构后台管理系统的静态网页实例。项目重点在于教学Bootstrap的使用，包括CSS样式、JavaScript插件和...
bootstrap案例
qq_65149711的博客
05-01 844
案例1：首页轮播图实现 组件：轮播-Carousel <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel"> <ol class="carousel-indicators"> <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"&gt
Bootstrap——Bootstrap学习笔记以及案例分享
Bonsoir777的博客
09-20 1652
本文主要介绍有关bootstrap 的使用方法
spingboot用户列表显示和实现新增功能
鲸鱼姐的专栏
05-06 578
需求,用户列表显示和实现新增功能 1. userList.html函数显示list,并增加”用户添加”button <!DOCTYPEhtml> <htmllang="en"xmlns:th="http://www.thymeleaf.org"> <head> <metacharset="UTF-8"> <m...
开源CRM管理系统-TP5+Bootstrap
07-11
本文将深入探讨一款基于ThinkPHP5（简称TP5）框架和Bootstrap前端框架构建的开源CRM管理系统——FastAdmin，分析其特点、优势及如何利用它进行高效开发。 一、FastAdmin简介 FastAdmin是一款基于TP5开发的后台极速...
Sash v9-bootstrap-5-admin-template 一款框架适合前端
06-01
Angular JS 是一个有Google维护的开源前端web应用程序框架。它最初由Brat Tech LLC的Misko Hevery于2009年开发出来。Angular JS是一个模型-视图-控制器（MVC）模式的框架，目的在于使HTML动态化。与其他框架相比，它...
响应式Bootstrap后台管理系统模板-Zegva
06-06
响应式Bootstrap后台管理系统模板-Zegva是一个专为构建高效、美观且适应性强的管理界面而设计的工具。这款模板基于Bootstrap框架，一个广泛使用的前端开发框架，由Twitter开发并维护，它提供了丰富的组件、预定义的...
Java bootstrap-3.4.1-dist 前端框架
03-18
这个"Java bootstrap-3.4.1-dist"压缩包包含的是Bootstrap框架的3.4.1版本，它是专门为Java开发者设计的一个前端资源集合。 在Bootstrap 3.4.1中，主要知识点包括： 1. **栅格系统**：Bootstrap的核心特性之一是其...
springboot-bootstrap 后台管理系统springboot-bootstrap.zip
05-17
【项目资源】：包含前端、后端、移动开发、操作系统、人工智能、物联网、信息化管理、数据库、硬件开发、大数据、课程资源、音视频、网站开发等各种技术项目的源码。包括STM32、ESP8266、PHP、QT、Linux、iOS、C++、...
全网超神bootstrap综合实战含源码
03-03
全网火爆的bootstrap综合实战，包含前台和后台项目，写代码，不枯燥！
基于BootStrap Javaweb学习_记录 附源码
qq_62106470的博客
05-25 358
Study
bootstrap4 网格布局实例_Bootstrap实现的经典栅格布局效果实例【附demo源码】
weixin_30300027的博客
01-14 775
本文实例讲述了Bootstrap实现的经典栅格布局效果。分享给大家供大家参考，具体如下：先来看看效果图：具体代码如下(某管理系统的Bootstrap实现)：/p>"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">XXXXX系统body {padding-top: 50px;padding-bottom: 40px;col...
Bootstrap CSS
qq_53694927的博客
08-24 488
Bootstrap CSS
BootStrap的应用
hongcaixia的博客
04-21 561
BootStrap的应用编写商城首页<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <!--声明文档兼容模式，表示使用IE浏览器的最新模式--> <meta http-equiv="X-UA-Compatible" content="IE=edge">
用vue和bootstrap实现用户信息添加效果
m0_71014221的博客
04-12 282
输入框为空时弹出警示框提醒用户完善信息；数据相同时提醒用户数据重复。
管理系统项目介绍
m0_61535334的博客
12-05 1130
登录： 收集数据 → 前端（数据校验）→ 把数据提交到后端 → 后端（数据校验）返回TOKEN → 设置到本地（持久化）并同步到Vuex（方便获取和响应式） 难点：权限 用户登录成功之后，后端返回当前用户的权限标识 前端根据后端返回的权限标识筛选出有权限的路由 筛选出来之后做了两件事情 把筛选出来的动态路由通过addRoutes添加到路由实例，目的：能够通过地址栏来访问 把筛选出来的动态路由添加到Vuex中，目的：给菜单栏使用 界面访问控制 在全局前置导航守卫里面做判断，如果有token，就直接放
02 | Bootstrap源码分析（二）
qiushily2030的博客
01-12 1271
netty客户端的启动和服务端启动复用性比较高，特别是NioEventLoopGroup|NioEventLoop等逻辑思想都是一致的，唯一的区别就在于服务端是DoBind、客户端是doResolveAndConnect，客户端这里有一个三次握手的实现，可以结合TCP的三次握手协议对照看看。如果有条件，后期还会补充对应jdk nio、linux epoll等处理逻辑，待续。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值