PHP에서 테이블 배경색을 변경하는 방법

PHPz
풀어 주다: 2023-04-24 15:47:32
원래의
1360명이 탐색했습니다.

PHP(Hypertext Preprocessor)는 웹사이트 개발에 널리 사용되는 스크립팅 언어로, 주로 동적 데이터 기반 웹사이트를 개발하는 데 사용됩니다. 웹 사이트 개발에서 테이블은 데이터 표시, 웹 페이지 레이아웃 등에 사용할 수 있는 매우 중요한 구성 요소 중 하나입니다. 테이블의 배경색을 포함하여 테이블의 모양도 사용자 경험에 중요합니다.

이 글에서는 PHP를 통해 테이블의 배경색을 변경하는 방법을 자세히 소개하겠습니다.

1. 스타일 시트(CSS) 사용

HTML에서 테이블의 배경색을 정의하는 가장 쉬운 방법은 스타일 시트를 사용하는 것입니다. CSS 스타일시트 파일을 웹사이트의 루트 디렉터리에 style.css라는 파일 이름으로 저장합니다. 스타일 시트 파일에서 모든 스타일을 정의한 다음 HTML 파일에서 스타일 시트 파일을 참조합니다. 다음은 스타일 시트 파일의 예입니다.

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;
}
로그인 후 복사

스타일 시트 파일에서는 테이블의 배경색을 흰색(#fff)으로, 홀수 행을 밝은 회색(#f2f2f2)으로 정의합니다. 테이블 헤더의 배경색은 어두운 회색(#555), 색상은 흰색(#fff), 테이블 셀 테두리는 너비 1픽셀, 회색 테두리(#ddd), 텍스트 내용은 8픽셀 상단, 하단, 왼쪽, 오른쪽에 공간이 있습니다.

HTML 파일의 태그에 다음 코드를 추가하세요.

<link rel="stylesheet" href="style.css">
로그인 후 복사

여기에 style.css 파일이 도입되었습니다.

다음으로 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>
로그인 후 복사

이 HTML 코드에서는 표 헤더와 표 내용을 포함하는 간단한 표를 만듭니다.

브라우저에서 HTML 파일을 열면 스타일 시트에 따라 테이블의 배경색이 변경된 것을 확인할 수 있습니다.

2. PHP를 사용하여 테이블의 배경색을 동적으로 변경합니다.

어떤 경우에는 PHP에서 테이블의 배경색을 동적으로 변경해야 합니다. 예를 들어, 데이터베이스 콘텐츠를 기반으로 테이블을 생성하는 경우 다양한 데이터를 기반으로 다양한 색상이 표시됩니다. 이 경우, 다음과 같은 방법으로 테이블의 배경색을 변경할 수 있습니다.

  1. 조건문 사용
<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>
로그인 후 복사

이 PHP 코드에서는 조건문을 사용하여 현재 행이 짝수 행인지 확인합니다. 그렇다면 테이블 배경색을 밝은 회색으로 설정하고, 그렇지 않으면 기본값을 흰색으로 설정합니다.

  1. 배열 사용
$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++;
}
로그인 후 복사

이 PHP 코드에서는 세 가지 색상 코드의 배열을 만든 다음 $i%3을 사용하여 색상 코드를 순환합니다.

요약

이 글에서는 테이블의 배경색을 변경하는 두 가지 방법, 즉 스타일 시트를 사용하는 방법과 PHP를 사용하여 동적으로 변경하는 방법을 소개했습니다. 어느 쪽이든 HTML과 CSS의 기본 구문을 이해해야 합니다. 이러한 방법을 통해 테이블의 모양을 유연하게 제어하고 웹 사이트의 사용자 경험을 향상시킬 수 있습니다.

위 내용은 PHP에서 테이블 배경색을 변경하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿