긴 텍스트로 인해 표 셀 확장을 방지하는 방법은 무엇입니까?

텍스트 길이에도 불구하고 표 셀 확장을 방지하는 방법

일반적인 표 레이아웃에서 열 너비는 가장 긴 셀의 길이에 맞게 조정됩니다. 그러나 셀 내의 텍스트에 관계없이 고정된 열 너비를 원하는 경우 다음 단계를 따르십시오.

해결책:

1. CSS를 사용하여 셀 너비 정의 : 테이블 정의 내에서 th 및 td 요소 모두에 대한 너비(예: 100px)를 지정합니다.
2. 설정 테이블 레이아웃을 고정으로: 이 속성은 테이블 너비가 일정하게 유지되어 열 확장을 방지합니다. 표의 크기를 완전히 제어하려면 표 자체의 너비를 설정하세요(예: 너비: 200px).
3. 텍스트 클리핑 활성화(선택 사항): 텍스트가 셀 외부로 넘치지 않도록 하려면 오버플로: 숨김을 추가하세요. 셀 정의.

예:

table {
  table-layout: fixed;
  width: 200px;
}

th,
td {
  width: 100px;
  overflow: hidden;
}

<table>
  <tr>
    <th>header 1</th>
    <th>header 234567895678657</th>
  </tr>
  <tr>
    <td>data asdfasdfasdfasdfasdf</td>
    <td>data 2</td>
  </tr>
</table>

이 단계를 준수하면 테이블 열 너비가 정의에 관계없이 고정된 상태로 유지되도록 할 수 있습니다. 셀의 텍스트 길이입니다. 이 접근 방식을 사용하면 테이블 표시에 대한 제어력이 향상되고 레이아웃을 방해할 수 있는 원치 않는 열 확장을 방지할 수 있습니다.

위 내용은 긴 텍스트로 인해 표 셀 확장을 방지하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!