최신 CSS를 사용하여 DIV 요소가 전체 테이블 셀을 채우도록 하려면 어떻게 해야 합니까?

최신 CSS를 사용하여 DIV가 전체 테이블 셀에 걸쳐 있는지 확인

과거에는 DIV를 원활하게 만드는 것이 어려웠습니다. 셀 크기에 대한 정확한 지식 없이 전체 테이블 셀을 채웁니다. 그러나 CSS3의 출현으로 간단하고 우아한 솔루션이 등장했습니다.

DIV를 테이블 셀 전체로 채우려면 셀의 너비와 높이를 모두 상속받아야 합니다. 이는 상위 행(TR)의 높이를 "1px"와 같은 작고 임의의 값으로 설정하고 테이블 셀의 높이(TD)를 "상속"으로 설정하여 달성할 수 있습니다.

마지막으로 테이블 셀 내의 DIV를 "높이: 100%"로 설정할 수 있습니다. 이렇게 하면 DIV가 셀의 전체 높이와 너비로 확장됩니다.

다음은 이 솔루션을 구현하는 방법의 예입니다.

<table>

이 접근 방식을 따르면 쉽게 다음을 만들 수 있습니다. 알 수 없는 크기에 관계없이 테이블 셀 전체에 걸쳐 있는 DIV입니다. 이 기술은 IE Edge 및 Chrome과 같은 최신 브라우저와 호환되어 지속적인 CSS 문제에 대한 강력하고 유연한 솔루션을 제공합니다.

위 내용은 최신 CSS를 사용하여 DIV 요소가 전체 테이블 셀을 채우도록 하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!