>웹 프론트엔드 >CSS 튜토리얼 >``와 CSS만 사용하여 테이블을 만들 수 있나요?

``와 CSS만 사용하여 테이블을 만들 수 있나요?

Susan Sarandon
Susan Sarandon원래의
2024-12-25 10:38:09848검색

Can I Create a Table Using Only `` and CSS?

만을 사용하여 테이블을 만드는 방법 태그 및 CSS

HTML의

요소와 CSS를 사용하면 브라우저 간 호환되는 기능 테이블을 만들 수 있습니다.

제공된 HTML 스니펫에서는 다양한 클래스를 사용하여 요소의 스타일을 지정합니다. 크로스 브라우저 경험을 위해 다음과 같이 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-col {
  float: left; /* fix for  buggy browsers */
  display: table-column;         
  width: 200px;         
  background-color: #ccc;  
}

조정된 CSS에서:

  • 다음에 대해 .divTable을 .div-table로 대체했습니다. 일관성.
  • 브라우저 간 호환성을 위해 border-collapse:separate;를 제거했습니다. .divTable에서.

이 업데이트된 CSS를 사용하면 IE7 이하를 포함한 모든 주요 브라우저에서 표가 올바르게 표시됩니다.

위 내용은 ``와 CSS만 사용하여 테이블을 만들 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.