[Bootstrap4] 06.1 부트스트랩4 테이블1

Posted by 낭만사업가 정대표 블로그 on 2022-03-01 02:57:16

부트스트랩4 기본 테이블

기본 Bootstrap 4 테이블에는 얇은 패딩과 수평 구분선이 있습니다. 

.table 클래스는 테이블에 기본 스타일을 추가합니다.

Example

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
Try it Yourself »

Striped Rows

.table-striped 클래스는 테이블에 사이로 줄무늬를 추가합니다.

Example

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
Try it Yourself »

Bordered Table

.table-bordered 클래스는 테이블과 셀의 모든 면에 테두리를 추가합니다.

Example

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
Try it Yourself »

Hover Rows

.table-hover  클래스는 테이블 행에 호버 효과(회색 배경색)를 추가합니다.

Example

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
Try it Yourself »

Black/Dark Table

.table-dark  클래스는 테이블에 검정색 배경을 추가합니다.

Example

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
Try it Yourself »

Dark Striped Table

.table-dark  와  .table-striped  를 결합하여 어두운 줄무늬 테이블을 만듭니다.

Example

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
Try it Yourself »

Hoverable Dark Table

.table-hover 클래스는 테이블 행에 호버 효과(회색 배경색)를 추가합니다.

Example

Firstname Lastname Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
Try it Yourself »

Total 106
번호 제목 글쓴이 조회 날짜
106 67 06-20
105 102 06-21
104 38 06-20
103 119 02-25
102 536 02-27
101 12 06-23
100 122 02-25
99 113 02-27
98 11 06-24
97 74 02-25
96 116 02-27
95 20 06-27
94 57 04-11
93 93 02-28
92 64 04-12
RSS

오픈런하우스

1인가구를 위한 원룸형 아파트 쉐어하우스, 1인기업(프리랜서)을 위한 홈오피스형 공유주택

GO!