How to set the background color of layui table

Layui table background color can be set through the following methods: 1. CSS style sheet; 2. table.init() method; 3. tr.css() method. In the above method, "#f2f2f2" can be replaced for your desired background color value.

layui table background color setting

layui The background color of the table can be set by the following method:

1. CSS style sheet:

<code class="css">.layui-table tr td {
  background-color: #f2f2f2;
}</code>

2. table.init() method:

<code class="javascript">layui.table.init('tableId', {
  elem: '#table',
  cols: [[]],
  style: 'background-color: #f2f2f2;'
});</code>

3. tr. css({ 'background-color': '#f2f2f2' }) method:

<code class="javascript">layui.table.on('row', function(obj) {
  obj.tr.css({ 'background-color': '#f2f2f2' });
});</code>

In the above method, "#f2f2f2" can be replaced with the background color value you want.

Detailed description:

• CSS style sheet: Passed as the cell of the table (tr td) Set the background color to uniformly set the background color of the entire table.
• table.init() method: When initializing the table, you can set the background color of the table through the style option.
• tr.css() method: In the row event of the table, you can dynamically set a row through the tr.css() method or background color for multiple lines.

The above is the detailed content of How to set the background color of layui table. For more information, please follow other related articles on the PHP Chinese website!