)를 사용하여 테이블을 생성하는 것은 번거로울 수 있습니다. <div>만을 사용하여 동등한 테이블 구조를 얻을 수 있습니까? 및 CSS?
샘플 테이블:
다음 샘플 테이블이 제공됩니다:
<div>
<div>
div>
CSS 스타일링:
다음 CSS 코드는 제공됨:
.divTable
{
display: table;
width: auto;
background-color: #eee;
border: 1px solid #666666;
border-spacing: 5px; /* cellspacing:poor IE support for this */
}
.divRow
{
display: table-row;
width: auto;
}
.divCell
{
float: left; /* fix for buggy browsers */
display: table-column;
width: 200px;
background-color: #ccc;
}
지원 IE7 이하의 경우:
제공된 코드는 디스플레이: 테이블 사용으로 인해 IE7 이하 버전과 호환되지 않습니다.
대체 해결 방법:
호환성 문제를 해결하기 위해 다음 CSS 코드를 사용할 수 있습니다. 사용됨:
.div-table {
display: table;
width: auto;
background-color: #eee;
border: 1px solid #666666;
border-spacing: 5px; /* cellspacing:poor IE support for this */
}
.div-table-row {
display: table-row;
width: auto;
clear: both;
}
.div-table -안부 {
float: left; /* fix for buggy browsers */
display: table-column;
width: 200px;
background-color: #ccc;
}
이점:
이 대체 CSS 코드는 원하는 테이블과 같은 구조를 유지하면서 IE7 이하 호환성을 제공합니다.
위 내용은 `` 및 CSS만 사용하여 테이블을 만들 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명:본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.