Tables

기본 타입(가로줄), 보더형 테이블, 줄무늬 테이블로 구성되어 있으며,
class 수정만으로 전환 가능합니다.

기본형 테이블 (class="table-default")
프로젝트 출시일 회원수 연매출 PM
리모트콜 5.0 2010.01.01 10005명 56억 간디
리모트콜 5.x 2012.05.01 10000명 100억 료코
리모트뷰 5.0 2010.01.01 10005명 56억 앙리
리모트 KVM 2010.01.01 10005명 56억 루니
알서포트홈페이지 2010.01.01 - - 케빈
보더형 테이블 (class="table-border")
프로젝트 출시일 회원수 연매출 PM
리모트콜 5.0 2010.01.01 10005명 56억 간디
리모트콜 5.x 2012.05.01 10000명 100억 료코
리모트뷰 5.0 2010.01.01 10005명 56억 앙리
리모트 KVM 2010.01.01 10005명 56억 루니
알서포트홈페이지 2010.01.01 - - 케빈
줄무늬형 테이블 (class="table-stripe")
프로젝트 출시일 회원수 연매출 PM
리모트콜 5.0 2010.01.01 10005명 56억 간디
리모트콜 5.x 2012.05.01 10000명 100억 료코
리모트뷰 5.0 2010.01.01 10005명 56억 앙리
리모트 KVM 2010.01.01 10005명 56억 루니
알서포트홈페이지 2010.01.01 - - 케빈
HTML
    

      
        

          프로젝트
          출시일
          회원수
          연매출
          PM
        

      
      
        

          리모트콜 5.0
          2010.01.01
          10005명
          56억
          간디
        

        

          리모트콜 5.x
          2012.05.01
          10000명
          100억
          료코
CSS
table { width: 100%; text-align: center; border-collapse: collapse; }
table th,
table td { padding: 8px 10px; }
table th { background: #DBE9F7; }

.table-default th { border-top: solid 1px #ccd5dc; }
.table-default th,
.table-default td { border-bottom: solid 1px #ccd5dc; }

.table-border { border: solid 1px #ddd; }
.table-border th,
.table-border td { border: solid 1px #ccd5dc; }

.table-stripe { border: solid 1px #ccd5dc; }
.table-stripe th,
.table-stripe td { border: solid 1px #ccd5dc; }
.table-stripe .even { background: #EEF3F8; }
History