Maison > interface Web > Tutoriel Layui > Comment définir la couleur d'arrière-plan de la table layui

Comment définir la couleur d'arrière-plan de la table layui

下次还敢
Libérer: 2024-04-28 22:03:14
original
796 Les gens l'ont consulté

La couleur d'arrière-plan du tableau Layui peut être définie via les méthodes suivantes : 1. Feuille de style CSS ; 2. Méthode table.init() ; 3. Méthode tr.css() Dans la méthode ci-dessus, "#f2f2f2" peut être remplacé. avec ce que vous voulez La valeur de la couleur d'arrière-plan.

Comment définir la couleur d'arrière-plan de la table layui

layui Paramètres de couleur d'arrière-plan du tableau

layui La couleur d'arrière-plan du tableau peut être définie par les méthodes suivantes :

1. Feuille de style CSS :

<code class="css">.layui-table tr td {
  background-color: #f2f2f2;
}</code>
Copier après la connexion

2. ) méthode :

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

3. tr.css({ 'background-color': '#f2f2f2' }) Méthode :

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

Dans la méthode ci-dessus, "#f2f2f2" peut être remplacé par la valeur de la couleur d'arrière-plan. tu veux.

Description détaillée :

  • Feuille de style CSS : En définissant la couleur d'arrière-plan des cellules du tableau (tr td), vous pouvez définir la couleur d'arrière-plan de l'ensemble du tableau de manière uniforme . tr td)设置背景色,可以统一设置整个表格的背景色。
  • table.init() 方法: 在初始化表格时,可以通过 style 选项设置表格的背景色。
  • tr.css() 方法: 在表格的 row 事件中,可以通过 tr.css()
Méthode table.init() : 🎜 Lors de l'initialisation du tableau, vous pouvez définir la couleur d'arrière-plan du tableau via l'option style. 🎜🎜🎜Méthode tr.css() : 🎜 Dans l'événement row du tableau, vous pouvez définir dynamiquement la couleur d'arrière-plan d'une ou plusieurs lignes via le tr.css() méthode . 🎜🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal