Pourquoi « background-color » ne fonctionne-t-il pas sur les cases à cocher dans un Div défilant et comment puis-je y remédier ?

L'énigme de l'attribut de couleur d'arrière-plan des cases à cocher en CSS

Le problème survient lors de l'utilisation de l'attribut 'background-color' sur les cases à cocher dans un '< défilant ;div>'. Bien qu'il ait un attribut 'margin-top' spécifié qui fonctionne normalement, l'attribut 'background-color' reste inefficace.

La curiosité vient de la façon dont un attribut peut fonctionner tandis que l'autre échoue, en particulier lorsque l'attribut '' ne définit aucun attribut de couleur d'arrière-plan conflictuel.

Cause et solution

La racine du problème réside dans la nature des cases à cocher. Les cases à cocher, par défaut, n'ont pas la capacité inhérente d'afficher les couleurs d'arrière-plan. Pour obtenir l'effet de couleur souhaité, vous pouvez cocher chaque case avec un «

» qui porte la couleur souhaitée.

Structure HTML révisée :

<div class="evenRow">
  <input type="checkbox">
</div>
<div class="oddRow">
  <input type="checkbox">
</div>
<div class="evenRow">
  <input type="checkbox">
</div>
<div class="oddRow">
  <input type="checkbox">
</div>

En encapsulant chaque case à cocher dans un '

' coloré, il devient possible d'appliquer indirectement les couleurs d’arrière-plan. Cette technique émule efficacement la fonctionnalité de l'attribut « background-color » pour les cases à cocher.

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!