테이블 너비
- 高洛峰원래의
- 2017-02-15 13:53:462240검색
테이블 너비에 관한 질문이지만 가장 답답한 것은 실제로 셀 td의 너비입니다. 개발 중에 이런 문제가 자주 발생하는데, 테이블 너비 알고리즘을 배우기 위해 정보를 찾아봤습니다.
table-layout
table-layout은 테이블 레이아웃 알고리즘을 정의하며 값은 자동 또는 고정입니다.
고정
테이블 레이아웃에 고정 테이블 레이아웃 알고리즘을 사용합니다. 테이블의 너비는 너비에 따라 결정되고 열의 너비는 셀의 첫 번째 행 너비에 따라 결정됩니다.
분석 결과, 여기 표의 계산된 너비는 200px, 첫 번째 열의 계산된 너비는 100px, 두 번째 열의 계산된 너비는 20px, 세 번째와 네 번째 열의 계산된 너비는 33px입니다. 세 번째와 네 번째 열의 너비는 표의 너비
에서 첫 번째와 두 번째 열의 너비와 셀의 왼쪽 및 오른쪽 테두리 너비의 합을 뺀 다음 2로 나눕니다. 어쩌면 "1-3"이 위치한 td가 너비를 정의하지 않는 이유는 무엇인지 궁금하실 것입니다. 세 번째 열이 계산되는 이유는 무엇입니까? 답: 너비를 정의하는 td가 첫 번째 줄에 없기 때문에 th가 첫 번째 줄에 위치합니다.
규칙
열 요소(col)를 설정하면 열 요소의 너비가 열의 너비로 설정됩니다.
열 요소의 너비는 자동이며, 열 요소가 설정되지 않은 경우 셀의 첫 번째 행 너비가 열 너비로 설정됩니다.
위 두 가지 조건이 충족되지 않을 경우 브라우저에 의해 계산되어 결정됩니다.
auto(기본값)
자동 테이블 레이아웃 알고리즘을 사용하여 테이블을 레이아웃합니다. 표와 셀의 너비는 포함된 내용에 따라 달라집니다. 너비는 여전히 셀에 대해 설정될 수 있습니다.
규칙
-
최소 셀 너비 계산
1.1 计算每个单元格的最小内容宽度：内容可以流入多行，但不能超出单元格。 1.2 如果单元格的width值大于最小可能宽度，则最小单元格宽度为单元格的width值。 1.3 如果单元格的width值为auto，则最小单元格宽度为为最小内容宽度。
최대 셀 너비 계산: 내용을 줄 바꿈 없이 완전히 표시합니다( 필요한 너비 줄바꿈을 표시할 때
최소 열 너비 계산: 열에 있는 모든 셀의 최소 셀 너비의 최대값
-
최대 열 너비 계산: 열에 있는 모든 셀의 최대 셀 너비의 최대값
셀이 열에 걸쳐 있는 경우 최소 열 너비의 합은 다음과 같아야 합니다. 이 확장 열과 같습니다. 셀의 최소 셀 너비입니다. 최대 열 너비는 이 셀의 최대 셀 너비와 같아야 합니다.
더 많은 테이블 너비 관련 기사를 보려면 PHP 중국어 사이트를 주목하세요!