使用BootStrap制作CRM管理系统

最新推荐文章于 2024-06-03 09:38:04 发布
最新推荐文章于 2024-06-03 09:38:04 发布
阅读量391 收藏 5
点赞数 1
文章标签： bootstrap 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_74795259/article/details/127754076
版权

目录

一 项目准备工作

1.1添加依赖

1.2项目开发中用到的图片资源

二 前端开发

2.1登录页面开发

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

运行效果

2.2首页开发 

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

运行效果

 2.3添加用户开发

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

运行效果

2.4、用户管理页面效果

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

运行效果

2.5、修改密码页面效果

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

运行效果

一 项目准备工作

1.1添加依赖

bootstrap依赖,JQuery依赖,vue依赖

1.2项目开发中用到的图片资源

二 前端开发

2.1登录页面开发

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <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>
    <script src="assets/vue.min-v2.5.16.js"></script>
    <script src="assets/axios.min.js"></script>
</head>
<body>
    <div class="container" id="app">
        <!--1画框-->
        <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">
                    <!--2显示标题的div-->
                    <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>
                    <!--3显示内容-->
                    <div class="col-md-7">
                        <!--4bootstap画hang-->
                        <div class="row">
                            <div class="col-md-12" style="text-align: center;font-size: 18px;font-weight: bold;padding:30px 0 30px 0;">
                                登录
                            </div>
                        </div>
                        <!--5bootstap画账号的行-->
                        <div class="row" style="height: 60px;margin-bottom: 20px;">
                            <div class="col-md-8 col-md-offset-2">
                                <lable>用户名</lable>
                                <input type="text" class="form-control" v-model="username"/>
                            </div>
                        </div>
                        <!--6bootstap画密码的行-->
                        <div class="row" style="height: 60px; margin-bottom: 20px;">
                            <div class="col-md-8 col-md-offset-2">
                                <lable>密码</lable>
                                <input type="possword" class="form-control" v-model="posswd"/>
                            </div>
                        </div>
                        <!--7bootstap画按钮的行-->
                        <div class="row" style="height: 60px;">
                            <div class="col-md-8 col-md-offset-2" style="text-align: center">
                               <button class="btn btn-primary" style="margin-right: 8px;" @click="dologin">登录</button>
                                <button class=" btn btn-default" @click="doRest">重置</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

运行效果

2.2首页开发 

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <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>
    <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: 600px;">
                <!--行-->
                <div class="row">
                    <div class="col-md-12" style="background-color: rgb(0,40,77);text-align: center;line-height: 70px;height: 70px;font-size: 20px;color: white;font-weight: bold;">
                        <!--添加蜗牛logo图片并设置大小-->
                        <img src="assets/img/logo.png" style="width:30px;height: 30px;margin-right: 8px;"/>
                        蜗牛GRC管理系统
                    </div>

                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                        <a href="index.html">进入首页</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                        <a href="user_list.html">用户管理</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                        <a href="user_add.html">添加用户</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                        <a href="#">客户管理</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                        <a href="#">添加客户</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                        <a href="update_pwd.html">修改密码</a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                        <a href="login.html">退出登录</a>
                    </div>
                </div>
            </div>
            <!--内容-->
            <div class="col-md-9" style="border: 1px solid gray;height: 600px">
                <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: 530px;padding: 20px">
                        <!--img-responsive照片响应式自动改变宽高-->
                        <img src="assets/img/index.png" class="img-responsive center-block"/>
                    </div>
                </div>
            </div>
        </div>
    </div>
 </body>
</html>

运行效果

 2.3添加用户开发

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <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>
    <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: 600px;">
            <!--行-->
            <div class="row">
                <div class="col-md-12" style="background-color: rgb(0,40,77);text-align: center;line-height: 70px;height: 70px;font-size: 20px;color: white;font-weight: bold;">
                    <!--添加蜗牛logo图片并设置大小-->
                    <img src="assets/img/logo.png" style="width:30px;height: 30px;margin-right: 8px;"/>
                    蜗牛GRC管理系统
                </div>

            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="index.html">进入首页</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="#">用户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="user_add.html">添加用户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="user_list.html">客户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="#">添加客户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="update_pwd.html">修改密码</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="login.html">退出登录</a>
                </div>
            </div>
        </div>
        <!--内容-->
        <div class="col-md-9" style="border: 1px solid gray;height: 600px">
            <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: 530px;padding: 20px">
                <!--显示内容-->
                <div class="col-md-12" style="background-color: white;height: 530px;border:none;border-radius: 5px;" >
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 50px;">
                            <lable>用户名</lable>
                            <input type="text" class="form-control"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px;">
                            <lable>昵称</lable>
                            <input type="text" class="form-control"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px;">
                            <lable>手机号</lable>
                            <input type="text" class="form-control"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px;">
                            <lable>生日</lable>
                            <input type="text" class="form-control"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 col-md-offset-4" style="margin-top: 20px;">
                            <lable style="margin-right: 15px; ">性别</lable>
                           <lable class="radio-inline">
                               <input type="radio"/>男
                           </lable>
                            <lable class="radio-inline">
                                <input type="radio"/>女
                            </lable>
                        </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_list.html，并导入依赖（bootstrap、vue）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <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>
    <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: 600px;">
            <!--行-->
            <div class="row">
                <div class="col-md-12" style="background-color: rgb(0,40,77);text-align: center;line-height: 70px;height: 70px;font-size: 20px;color: white;font-weight: bold;">
                    <!--添加蜗牛logo图片并设置大小-->
                    <img src="assets/img/logo.png" style="width:30px;height: 30px;margin-right: 8px;"/>
                    蜗牛GRC管理系统
                </div>

            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="index.html">进入首页</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="#">用户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="user_add.html">添加用户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="user_list.html">客户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="#">添加客户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="update_pwd.html">修改密码</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="login.html">退出登录</a>
                </div>
            </div>
        </div>
        <!--内容-->
        <div class="col-md-9" style="border: 1px solid gray;height: 600px">
            <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: 530px;padding: 20px">
                <!--显示内容-->
                <div class="col-md-12" style="background-color: white;height: 530px;border:none;border-radius: 5px;" >
                   <!--使用bootstap斑马线样式-->
                    <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>张三</td>
                            <td>阿三</td>
                            <td>男</td>
                            <td>2000-01-01</td>
                            <td>18888888888</td>
                            <td>
                                <button class="btn btn-link">修改</button>
                                <button class="btn btn-link">删除</button>
                            </td>
                        </tr>
                        <tr>
                            <td>1002</td>
                            <td>李四</td>
                            <td>阿四</td>
                            <td>女</td>
                            <td>2001-01-01</td>
                            <td>18886668888</td>
                            <td>
                                <button class="btn btn-link">修改</button>
                                <button class="btn btn-link">删除</button>
                            </td>
                        </tr>
                        <tr>
                            <td>1003</td>
                            <td>王五</td>
                            <td>阿五</td>
                            <td>男</td>
                            <td>2003-01-01</td>
                            <td>16666666888</td>
                            <td>
                                <button class="btn btn-link">修改</button>
                                <button class="btn btn-link">删除</button>
                            </td>
                        </tr>
                        <tr>
                            <td>1004</td>
                            <td>赵六</td>
                            <td>阿六</td>
                            <td>男</td>
                            <td>2001-01-02</td>
                            <td>166666777888</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.5、修改密码页面效果

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <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>
    <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: 600px;">
            <!--行-->
            <div class="row">
                <div class="col-md-12" style="background-color: rgb(0,40,77);text-align: center;line-height: 70px;height: 70px;font-size: 20px;color: white;font-weight: bold;">
                    <!--添加蜗牛logo图片并设置大小-->
                    <img src="assets/img/logo.png" style="width:30px;height: 30px;margin-right: 8px;"/>
                    蜗牛GRC管理系统
                </div>

            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="index.html">进入首页</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="user_list.html">用户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="user_add.html">添加用户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="#">客户管理</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="#">添加客户</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="update_pwd.html">修改密码</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12" style="text-align: center;padding:20px 8px 20px 8px;">
                    <a href="login.html">退出登录</a>
                </div>
            </div>
        </div>
        <!--内容-->
        <div class="col-md-9" style="border: 1px solid gray;height: 600px">
            <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: 530px;padding: 20px">
                    <!--img-responsive照片响应式自动改变宽高-->
                    <div class="col-md-12"style="background-color: white;height: 530px;border: none;border-radius: 5px;">
                       <div class="row">
                           <div class="col-md-4 col-md-offset-4" style="margin-top: 80px;">
                               <table>当前密码</table>
                               <input type="possword" class="form-control"/>
                           </div>
                       </div>
                        <div class="row">
                            <div class="col-md-4 col-md-offset-4" style="margin-top: 50px;">
                                <table>确认密码</table>
                                <input type="possword" class="form-control"/>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-4 col-md-offset-4" style="margin-top: 30px;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>
</div>
</body>
</html>

运行效果

 

雷大胖胖
关注
  • 1
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Bootstrap(书籍查询&购物车&订单)
qq_64001795的博客
05-13 631
目录 媒体对象实现书籍查询页面 购物车 模态框实现订单 媒体对象实现书籍查询页面 <div class="col-md-9 aa"> <!-- 媒体对象实现书籍搜索 --> <!-- list-unstyled 去除列表对象 --> <ul class="list-unstyled"> <li class="media" style="border-bottom: 1px solid #00000
使用flask+bootstrap+python+mysql制作的简易库存管理系统.zip
01-21
客户关系管理系统（CRM）： 用于管理与客户之间的关系，包括客户信息、沟通记录、销售机会跟踪等。CRM系统有助于企业更好地理解客户需求，提高客户满意度和保留率。 医院管理系统： 用于管理医院或医疗机构的患者...
精品订单管理系统bootstrap后台框架模板-Admin Template
06-06
精品订单管理系统bootstrap后台框架模板-Admin Template
基于Bootstrap的纯静态通用后台管理HTML模板设计源码
04-16
本源码项目是基于Bootstrap的纯静态通用后台管理HTML模板设计，包含1642个文件，主要使用JavaScript、HTML和CSS编程语言。该项目是一个基于Bootstrap 5.1.3+的后台管理HTML模板，适用于多种后台管理系统，如网站管理、内容管理系统等。模板包含了丰富的组件和布局，如导航栏、表格、表单等，用户可以根据需要进行修改和扩展。
探索下一代网页设计——基于Bootstrap 5的简单管理仪表盘模板
最新发布
gitblog_00075的博客
06-03 326
探索下一代网页设计——基于Bootstrap 5的简单管理仪表盘模板 项目地址:https://gitcode.com/themesberg/simple-bootstrap-5-dashboard 在这个快速发展的数字时代，高效且美观的网页设计至关重要。今天，我们向您推荐一个开源项目——Simple Bootstrap 5 Dashboard，这是一个由Themesberg团队精心制作的教程项目...
bootstrap + django的简单后台管理系统
COOL66BOY的博客
04-14 7707
文章目录登录页面Form和MiddleForm的书写HTML代码：信息管理页面母版HTML代码管理员信息各种功能页面Ajax数据传输JS部分数据统计页面JS部分文件上传HTML部分代码Python代码部分media配置补充 使用的是django3.0版本，数据库使用的是mysql1.0版本的 项目所包含的文件如下图： 登录页面 需要实现功能： 1、用户输入的用户名，密码和验证码能在后台获取 2、将获取的数据进入到数据库查找 3、成功登录后，将用户存储一个cookie在浏览器的session里面 4
SpringBoot+Bootstrap农业物资管理系统JavaI采购销售jsp源代码Mysql
wjwjwjd的博客
10-29 135
SpringBoot+Bootstrap农业物资管理系统JavaI采购销售jsp源代码Mysql
Azia-Admin-Bootstrap-Template：免费Bootstrap 4管理模板
02-03
非常适合构建管理面板，电子商务系统，项目管理系统，CMS或CRM。 尽管模板的设计与众不同，但可以轻松自定义以满足您的要求。 Azia Admin带有干净且注释良好的代码，可轻松使用模板。 因此，它是快速启动项目的理想...
（含实训报告）黑马boot客户管理系统（源码+数据库文件）.zip
06-24
【标题】：“黑马boot客户管理系统”是一个基于SSM框架与Bootstrap技术实现的客户关系管理系统的实践项目，包含源代码和数据库文件。 【描述】：该系统的核心开发采用SSM（Spring、SpringMVC、MyBatis）框架，这是...
旅游管理简历电子版
07-28
总的来说，一个精心制作的“旅游管理简历电子版”是你打开旅游行业大门的关键。它不仅展示你的专业技能，还展现了你的职业素养和个人品牌。用心打造这份简历，你将在竞争激烈的求职市场中脱颖而出。
.NET制作房地产信息管理系统
04-25
本文将详细介绍.NET制作房地产信息管理系统的关键技术和设计思路。 一、.NET框架基础 .NET是微软公司推出的一款开源开发平台，它提供了丰富的类库和工具，支持多种编程语言，如C#、VB.NET等，使得开发者能够快速...
crm系统bootstrap模板.zip_bootstrap_bootstrap模板_crm页面模板_html5模板_up81d
07-14
基于bootstrap和html5的crm系统完整页面模板
ssh+bootstrap实现用户管理
09-28
ssh+bootstrap实现用户管理，其功能包括：hibernate实现数据的增删改查，验证码，项目访问路径拦截器，bootstrap的使用，数据分页，以及查询之后的分页。源码下载后，将hibernate.cfg.xml中的用户名以及密码改变，可以直接使用。
一套很酷的bootstrap后台管理系统静态页面
04-28
一套很酷的bootstrap后台管理系统静态页面
非常好看的HTML5 Bootstrap搭建的后台管理系统模板
03-10
非常好看的HTML5 Bootstrap搭建的后台管理系统模板，是完整的一套，包括了登录，主页，菜单，各种表单样式 演示地址：http://usman.it/themes/charisma
bootstrap后台管理系统前后台实现(含数据库)
pengyufight的博客
07-01 3万+
撰写本文档目的是让后续开发者在理解该系统架构的基础上遵循一定规范保持系统架构的合理性；同时也能够达到允许没有开发经验仅有web基础的入门开发者能够通过复制粘贴的方式仿照demo示例进行开发的目的。 目 录 1 案例调研与选取... 2 1.1 案例调研... 2 1.2 UI选取... 3 2 系统实现... 3 2.1 实...
使用bootstrap制作CRM管理系统
weixin_44535029的博客
11-08 131
boostrap依赖、jQuery依赖、vue的依赖。
BootSrap案例CRM管理系统-查询所有用户
热爱生活,热爱技术,对未知永远保持好奇!
11-09 271
查询所有用户
使用bootstrap搭建后台管理系统页面《一》
热门推荐
空空说技术的博客
03-24 5万+
1. 使用bootstrap搭建后台管理系统页面《一》 一般的后台管理系统页面主体包括四个部分，顶部导航栏，左侧菜单栏，中间正文页和底部的页脚。 其中左侧和顶部使用的是bootstrap的导航和下拉菜单组件，主体页面为了演示方便，使用了iframe框架。 1.1 nav组件 接下...
使用bootstrap搭建管理系统
04-28
使用 Bootstrap 搭建管理系统非常方便，以下是一个简单的步骤： 1. 下载 Bootstrap 首先，你需要从官方网站下载 Bootstrap。你可以下载最新版的 Bootstrap，也可以下载旧版的 Bootstrap。 2. 创建 HTML 文件 创建一个 HTML 文件，并将 Bootstrap 的 CSS 和 JavaScript 引入到 HTML 文件中。你可以从 Bootstrap 的官方网站中找到这些文件的链接。 3. 使用 Bootstrap 样式 使用 Bootstrap 的样式来设计你的管理系统。Bootstrap 提供了许多样式，如表格、表单、按钮等。 4. 使用 Bootstrap 组件 Bootstrap 还提供了许多组件，如导航栏、面包屑、警告框等。你可以使用这些组件来构建你的管理系统。 5. 自定义样式 如果你想要自定义样式，可以使用 Bootstrap 的变量和混合器。Bootstrap 的变量和混合器可以让你轻松地自定义样式。 6. 测试和部署 最后，你需要测试你的管理系统，并将其部署到服务器上。你可以使用一些工具来测试你的管理系统，如 Chrome 开发者工具和 Firebug。 希望这些步骤能够帮助你使用 Bootstrap 搭建管理系统。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值