bootstrap-table样式修改

bootstrap-table修改后的效果如下

1.删除边线

<style>

   .table>tbody>tr>td{
    border-top: 1px solid transparent !important;
    border-right: 1px solid transparent !important;
    border-left: 1px solid transparent !important;
    }
    .table>thead>tr>th{
    border-right: 1px solid transparent !important;
    border-left: 1px solid transparent !important;
    }
</style>

2. 修改toolbar位置

<section id="main-content">
    <section class="wrapper">
        <!-- page start-->
        <div class="row ">
            <div class="col-sm-12">

                <section class="panel">

                    <div class="panel-body">
                        <h4><i class="fa fa-tasks"></i> 用户管理 </h4>
                        <hr>
                        <div id="toolbar">
                            <form class="form-inline">
                                姓名<input type="text" name="username" class="form-control"  size="15"  id="name">
                                工号<input type="text" name="employeeNum"  class="form-control"  size="15" id="num">
                                部门<input type="text" name="department"  class="form-control"  size="15" id="depart">
                                <input type="button" value="搜索" class="btn btn-default btn-sm"  onclick="searchUser()">
                                <input type="button" value="重置" class="btn btn-default btn-sm" onclick="resetUser()">
                            </form>
                        </div>
                        <!-- 加载bootstraptable的表格，ID名称必须为bootstrap-table -->
                        <table id="bootstrap-table"  class="table table-striped table-advance table-hover">
                            <thead>
                            <tr>
                                <th data-field="state" data-checkbox="true"></th>
                                <th data-field="id" data-sortable="true">ID</th>
                                <th data-field="username" data-sortable="true" data-searchable="true" data-filter-control="input">姓名</th>
                                <th data-field="employeeNum" data-sortable="true" data-searchable="true" data-filter-control="input">工号</th>
                                <th data-field="unitName">单位</th>
                                <th data-field="department">部门</th>
                                <th data-field="sex">性别</th>
                            </tr>
                            </thead>
                        </table>
                    <div class="add-task-ro">
                        <input  type="button" value="新增用户" id="addBtn" data-toggle="modal" onclick="targetAddUser()" class="btn btn-success  btn-sm" data-backdrop="false">
                        <input  type="button" value="修改用户" id="editBtn" data-toggle="modal" class="btn btn-success  btn-sm" onclick="editUser()" data-backdrop="false">
                        <input  type="button" value="删除用户" id="deleteBtn" data-toggle="modal" class="btn btn-danger btn-sm" onclick="deleteModel()">
                    </div>
                    </div>
                </section>
            </div>
        </div>
    </section>
</section>

3.js代码，不显示bootstrap-table多余按钮

/bootstrap-table初始化
$("#bootstrap-table").bootstrapTable({
    url: "pageModel",
    //请求后台的URL（*）
    dataType: "json",
    // 此间是与client不一样的地方=======================开始
    contentType: "application/x-www-form-urlencoded",
    sidePagination: "server",
    //分页方式：client客户端分页，server服务端分页（*）
    //修改请求参数，不设置则有默认值 ，返回值必须是一个对象
    method: 'POST',
    //请求方式（*）
    toolbar: '#toolbar',
    toolbarAlign:'right',
    sortable: true,
    sortName: "id",
    sortOrder: "desc",
    //排序方式
    // 此间是与client不一样的地方=======================结束
    striped: true,
    //是否显示行间隔色
    cache: false,
    //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
    pagination: true,
    showHeader: true,
    pageNumber: 1,
    //初始化加载第一页，默认第一页,并记录
    pageSize: 10,
    //每页的记录行数（*）
    pageList: [10, 20, 100],
    queryParams:queryParam,
    //最少允许的列数
    clickToSelect: true,
    //是否启用点击选中行
    uniqueId: "id",
    //每一行的唯一标识，一般为主键列
});



function queryParam(params){
    var name = $('#name').val();   
    var num = $('#num').val();
    var depart = $('#depart').val();
    	var param = {
    	        pageNumber : this.pageNumber,
    	        pageSize : this.pageSize,
    	        name: name,
                num: num,
                depart:depart
    	};
    	return param;
    }