Maison > développement back-end > Problème PHP > Comment ajouter des lignes horizontales au tableau en php

Comment ajouter des lignes horizontales au tableau en php

PHPz
Libérer: 2023-04-03 16:10:01
original
1409 Les gens l'ont consulté

En PHP, l'ajout de lignes horizontales à un tableau peut être réalisé en ajoutant des styles CSS.

CSS (Cascading Style Sheets) est un langage utilisé pour contrôler le style et la mise en page des pages Web et peut ajouter des styles aux éléments HTML. En ajoutant des styles CSS spécifiques, l'élément tableau peut être affiché sous forme de tableau avec des lignes horizontales sur la page Web.

Voici les étapes pour ajouter des lignes horizontales à un tableau :

Étape 1 : Créer un élément de tableau HTML

Tout d'abord, créez un élément de tableau en HTML, ce qui peut être réalisé en utilisant la balise table et d'autres balises associées.

Ce qui suit est un exemple de tableau HTML simple :

<table>
  <tr>
    <th>姓名</th>
    <th>性别</th>
    <th>年龄</th>
  </tr>
  <tr>
    <td>张三</td>
    <td>男</td>
    <td>28</td>
  </tr>
  <tr>
    <td>李四</td>
    <td>女</td>
    <td>32</td>
  </tr>
</table>
Copier après la connexion

Dans le code ci-dessus, un simple tableau de données est créé via l'élément table, contenant trois colonnes : nom, sexe et âge, et deux lignes de données.

Étape 2 : Ajouter un style CSS

Ensuite, ajoutez un style CSS en PHP pour ajouter des lignes horizontales au tableau.

Ce qui suit est un exemple d'utilisation de styles CSS pour ajouter des lignes horizontales à un tableau :

<style type="text/css">
table {
  border-collapse: collapse;
  width: 100%;
}

table th, table td {
  border: 1px solid #ccc;
}

table th {
  background-color: #f7f7f7;
  font-weight: bold;
}

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

table tr:hover {
  background-color: #eaeaea;
}
</style>
Copier après la connexion

Dans le code ci-dessus, un style de tableau est défini et la bordure et la largeur du tableau sont définies. En même temps, le style de bordure de l'en-tête du tableau et des cellules de contenu, ainsi que la couleur d'arrière-plan et l'effet gras de l'en-tête du tableau sont définis. En définissant la couleur d'arrière-plan des lignes paires et en survolant la souris, l'effet d'un tableau avec des lignes horizontales est obtenu.

Étape 3 : Appliquer les styles CSS à l'élément de tableau HTML

Enfin, appliquez les styles CSS ci-dessus à l'élément de tableau HTML.

Ce qui suit est un exemple de code PHP complet :

<!DOCTYPE html>
<html>
<head>
  <title>PHP Table Style</title>
  <meta charset="UTF-8">
  <style type="text/css">
    table {
      border-collapse: collapse;
      width: 100%;
    }

    table th, table td {
      border: 1px solid #ccc;
    }

    table th {
      background-color: #f7f7f7;
      font-weight: bold;
    }

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

    table tr:hover {
      background-color: #eaeaea;
    }
  </style>
</head>
<body>
  <table>
    <tr>
      <th>姓名</th>
      <th>性别</th>
      <th>年龄</th>
    </tr>
    <tr>
      <td>张三</td>
      <td>男</td>
      <td>28</td>
    </tr>
    <tr>
      <td>李四</td>
      <td>女</td>
      <td>32</td>
    </tr>
  </table>
</body>
</html>
Copier après la connexion

En exécutant le code PHP ci-dessus, un tableau de données avec des lignes horizontales peut être affiché dans la page Web.

Résumé

En PHP, l'ajout de lignes horizontales à un tableau peut être réalisé en ajoutant des styles CSS. En définissant des attributs de style tels que les bordures de tableau, les couleurs d'arrière-plan des lignes paires et les effets de survol de la souris, l'élément de tableau peut être affiché sous forme de tableau avec des lignes horizontales sur la page 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!

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