ホームページ > バックエンド開発 > PHPの問題 > PHPで表に水平線を追加する方法

PHPで表に水平線を追加する方法

PHPz
リリース: 2023-04-03 16:10:01
オリジナル
1395 人が閲覧しました

PHP では、CSS スタイルを追加することでテーブルに水平線を追加できます。

CSS (Cascading Style Sheets) は、Web ページのスタイルとレイアウトを制御するために使用される言語であり、HTML 要素にスタイルを追加できます。特定の CSS スタイルを追加すると、Web ページ上でテーブル要素を水平線のあるテーブルとして表示できます。

表に水平線を追加する手順は次のとおりです:

ステップ 1: HTML 表要素を作成する

まず、HTML で表要素を作成します。 table タグとその他の関連タグを使用して実現します。

以下は簡単な HTML テーブルの例です:

<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>
ログイン後にコピー

上記のコードでは、名前、性別、年齢の 3 つの列と 2 つの列を含む単純なデータ テーブルが table 要素によって作成されます。データ行。

ステップ 2: CSS スタイルを追加する

次に、PHP で CSS スタイルを追加して、テーブルに水平線を追加します。

以下は、CSS スタイルを使用してテーブルに水平線を追加する例です。

<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>
ログイン後にコピー

上記のコードでは、テーブル スタイルが定義され、テーブルの境界線と幅が設定されています。同時に、テーブルヘッダーとコンテンツセルの境界線スタイル、およびテーブルヘッダーの背景色と太字効果が定義されます。偶数行の背景色を設定してマウスをホバーさせると、横線が入った表のような効果が得られます。

ステップ 3: CSS スタイルを HTML テーブル要素に適用する

最後に、上記の CSS スタイルを HTML テーブル要素に適用します。

以下は完全な PHP コードの例です:

<!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>
ログイン後にコピー

上記の PHP コードを実行すると、Web ページ上に水平線のデータ テーブルを表示できます。

概要

PHP では、CSS スタイルを追加することで表に水平線を追加できます。表の枠線、偶数行の背景色、マウスホバー効果などのスタイル属性を設定することで、Webページ上で表要素を横線の表として表示できます。

以上がPHPで表に水平線を追加する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート