首页用layui写一个查询数据信息表格，要求居中

用layui写一个查询数据信息表格，要求居中

时间: 2024-04-17 17:24:55 浏览: 92

好的，以下是使用layui框架编写一个居中的查询数据信息表格的示例代码： ```html <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="https://cdn.staticfile.org/layui/2.5.6/css/layui.css"> </head> <body> <table id="data-table" lay-filter="data-table"></table> <script src="https://cdn.staticfile.org/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdn.staticfile.org/layui/2.5.6/layui.js"></script> <script> layui.use(['table'], function(){ var table = layui.table; // 渲染表格 table.render({ elem: '#data-table', url: 'your_data_url', cols: [[ {field: 'id', title: 'ID', align: 'center'}, {field: 'name', title: '姓名', align: 'center'}, {field: 'age', title: '年龄', align: 'center'}, // 其他字段... ]], page: true, // 开启分页 limit: 10, // 每页显示的记录数 limits: [10, 20, 30], // 每页可选择的记录数 }); }); </script> </body> </html> ``` 请将上述代码保存为一个HTML文件，并将`your_data_url`替换为你实际的数据接口地址。这样就可以在浏览器中打开该HTML文件，查看居中的查询数据信息表格了。

阅读全文