Maison >développement back-end >Problème PHP >Comment changer la couleur d'arrière-plan du tableau en php

Comment changer la couleur d'arrière-plan du tableau en php

PHPz
PHPzoriginal
2023-04-24 14:50:291393parcourir

PHP (Hypertext Preprocessor) est un langage de script largement utilisé dans le développement de sites Web, principalement utilisé pour développer des sites Web dynamiques basés sur des données. Dans le développement de sites Web, les tableaux sont l'un des composants très importants qui peuvent être utilisés pour afficher des données, mettre en page des pages Web, etc. L'apparence du tableau est également importante pour l'expérience utilisateur, y compris la couleur d'arrière-plan du tableau.

Cet article présentera en détail comment changer la couleur d'arrière-plan du tableau via PHP.

1. Utiliser des feuilles de style (CSS)

Le moyen le plus simple de définir la couleur de fond d'un tableau en HTML est d'utiliser une feuille de style. Placez un fichier de feuille de style CSS dans le répertoire racine du site Web, avec le nom de fichier style.css. Définissez tous les styles dans le fichier de feuille de style, puis référencez le fichier de feuille de style dans le fichier HTML. Voici un exemple de fichier de feuille de style :

table {
  background-color: #fff;
}

table tr:nth-child(odd) {
  background-color: #f2f2f2;
}

table th {
  background-color: #555;
  color: #fff;
}

table td {
  border: 1px solid #ddd;
  padding: 8px;
}

Dans le fichier de feuille de style, nous définissons la couleur de fond du tableau comme étant blanche (#fff), les lignes impaires comme étant gris clair (#f2f2f2), et la couleur d'arrière-plan de l'en-tête du tableau doit être gris foncé (# 555), la couleur est blanche (#fff), la bordure des cellules du tableau a une largeur de 1 pixel, une bordure grise (#ddd) et le contenu du texte a 8 pixels de largeur. espace en haut, en bas, à gauche et à droite.

Ajoutez le code suivant à la balise du fichier HTML :

<link rel="stylesheet" href="style.css">

Ici, nous avons introduit le fichier style.css.

Ensuite, nous créons un tableau dans le fichier HTML.

<table>
  <thead>
    <tr>
      <th>标题1</th>
      <th>标题2</th>
      <th>标题3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>内容1</td>
      <td>内容2</td>
      <td>内容3</td>
    </tr>
    <tr>
      <td>内容4</td>
      <td>内容5</td>
      <td>内容6</td>
    </tr>
    <tr>
      <td>内容7</td>
      <td>内容8</td>
      <td>内容9</td>
    </tr>
  </tbody>
</table>

Dans ce code HTML, nous créons un tableau simple, comprenant l'en-tête et le contenu du tableau.

Ouvrez le fichier HTML dans le navigateur, vous constaterez que la couleur de fond du tableau a été modifiée en fonction de la feuille de style.

2. Utilisez PHP pour changer dynamiquement la couleur d'arrière-plan du tableau

Dans certains cas, nous devons changer dynamiquement la couleur d'arrière-plan du tableau en PHP. Par exemple, lors de la génération d'un tableau basé sur le contenu d'une base de données, différentes couleurs sont affichées en fonction de différentes données. Dans ce cas, nous pouvons changer la couleur d’arrière-plan du tableau en utilisant la méthode suivante.

  1. Utiliser des instructions conditionnelles
<table>
  <thead>
    <tr>
      <th>标题1</th>
      <th>标题2</th>
      <th>标题3</th>
    </tr>
  </thead>
  <tbody>
    <?php
      $i = 1;
      while ($row = mysql_fetch_assoc($result)) {
        if ($i % 2 == 0) {
          echo &#39;<tr style="background-color:#f2f2f2;">';
        } else {
          echo '<tr>';
        }
        echo '<td>'.$row['col1'].'</td>';
        echo '<td>'.$row['col2'].'</td>';
        echo '<td>'.$row['col3'].'</td>';
        echo '</tr>';
        $i++;
      }
    ?>
  </tbody>
</table>

Dans ce code PHP, nous utilisons des instructions conditionnelles pour déterminer si la ligne actuelle est une ligne paire. Si c'est le cas, définissez la couleur d'arrière-plan du tableau sur gris clair, sinon elle est par défaut blanche.

  1. Utilisation de tableaux
$colors = array('#fff', '#f2f2f2', '#ccc');
$i = 0;
while ($row = mysql_fetch_assoc($result)) {
  echo '<tr style="background-color:&#39;.$colors[$i % 3].&#39;;">';
  echo '<td>'.$row['col1'].'</td>';
  echo '<td>'.$row['col2'].'</td>';
  echo '<td>'.$row['col3'].'</td>';
  echo '</tr>';
  $i++;
}

Dans ce code PHP, nous créons un tableau de trois codes de couleur, puis utilisons $i%3 pour parcourir les codes de couleur.

Résumé

Dans cet article, nous avons présenté deux méthodes pour changer la couleur de fond d'un tableau : utiliser une feuille de style et la changer dynamiquement à l'aide de PHP. Quoi qu’il en soit, vous devez comprendre la syntaxe de base du HTML et du CSS. Grâce à ces méthodes, vous pouvez contrôler de manière flexible l’apparence du tableau et améliorer l’expérience utilisateur du site Web.

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!

Déclaration:
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