Home > Backend Development > PHP Problem > How to add horizontal lines to table in php

How to add horizontal lines to table in php

PHPz
Release: 2023-04-03 16:10:01
Original
1426 people have browsed it

In PHP, adding horizontal lines to a table can be achieved by adding CSS styles.

CSS (Cascading Style Sheets) is a language used to control the style and layout of web pages and can add styles to HTML elements. By adding specific CSS styles, the table element can be displayed as a table with horizontal lines on the web page.

The following are the steps to add horizontal lines to a table:

Step 1: Create an HTML table element

First, create a table element in HTML. You can use the table tag and Other related tags to achieve.

The following is a simple HTML table example:

<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>
Copy after login

In the above code, a simple data table is created through the table element, containing three columns: name, gender and age, and two data row.

Step 2: Add CSS style

Next, add CSS style in PHP to add horizontal lines to the table.

The following is an example of using CSS styles to add horizontal lines to a table:

<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>
Copy after login

In the above code, a table style is defined and the table border and width are set. At the same time, the border style of the table header and content cells, as well as the background color and bold effect of the table header are defined. By setting the background color of even-numbered rows and mouse hover, the effect of a table with horizontal lines is achieved.

Step 3: Apply CSS styles to HTML table elements

Finally, apply the above CSS styles to HTML table elements.

The following is a complete PHP code example:

<!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>
Copy after login

By running the above PHP code, a data table with horizontal lines can be displayed on the web page.

Summary

In PHP, adding horizontal lines to a table can be achieved by adding CSS styles. By setting style attributes such as table borders, even-numbered row background colors, and mouse hover effects, the table element can be displayed as a table with horizontal lines on the web page.

The above is the detailed content of How to add horizontal lines to table in php. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template