테이블 너비는 조정 가능하며 일부 TD는 너비가 고정되어 있습니다. 테이블의 너비는 화면에 따라 변하는 값이 아닌 고정된 값으로 설정하는 것을 원칙으로 합니다. 이제 테이블 td 셀의 너비를 설정하는 방법을 살펴보겠습니다.
예 1: Table의 너비가 600px이고 Table의 모든 tds의 총 너비가 600px 미만입니다. 브라우저는 td의 너비 비율에 따라 자동으로 너비를 계산합니다
<table style="width: 600px;border-collapse: collapse;" > <tr> <td style="width: 200px;">我是200px</td> <td style="width: 200px;">我也是200px</td> </tr> </table> 运行结果:两个td都是300px;
Table의 너비는 600px이고 처음 두 td의 너비는 입니다. 너비가 이미 600px이므로 세 번째 TD의 너비는 지정되지 않습니다. 이 경우 세 번째 TD의 너비는 콘텐츠의 너비를 기준으로 합니다. 그런 다음 처음 두 개의 너비는 비율에 따라 계산됩니다.
예시 2: 처음 두 td가 테이블 너비보다 작으면 마지막 td가 완성 역할을 합니다
<table style="width: 600px;border-collapse: collapse;" > <tr> <td style="width: 300px;">我是200px</td> <td style="width: 300px;">我也是200px</td> <td >我是根据内容的</td> </tr> </table>
예시 3: 테이블의 td 내에서 블록 요소가 너비를 초과하여 배치된 경우 td 및 테이블의 테이블 -layout: 고정; (고정은 td의 너비가 고정 길이이고 td 내용의 변경에 따라 변경되지 않음을 의미합니다). 이런 식으로 IE6 및 7에서는 스크롤 막대가 표시되지 않으므로 td에 Overflow: auto;를 쓰지 마십시오. 가장 좋은 방법은 너비를 100%로 설정하여 div를 래핑하는 것입니다
<table style="width: 600px;border-collapse: collapse;table-layout: fixed;" > <tr> <td style="width: 200px;"><div style="width: 100%;overflow: auto;"><div style="width: 300px;height: 100px;background-color: red;"></div></div></td> <td >我是自由宽度</td> </tr> </table>
위 내용은 HTML에서 테이블 tr의 td 셀 너비 속성을 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!