======Bootstrap Tables====== * description : Bootstrap Tables * author : 오션 * email : shlim@repia.com * lastupdate : 2021-03-24 \\ =====Bootstrap Basic Table===== 기본 부트스트랩 테이블에는 얇은 패딩과 수평 구분선만 있습니다.\\ \\ ''.table'' 클래스는 테이블에 기본 스타일을 추가합니다.\\ \\ ====예제====

Basic Table

The .table class adds basic styling (light padding and only horizontal dividers) to a table:

First Name Last Name Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
\\ =====Striped Rows===== ''.table-striped'' 클래스는 테이블에 얼룩말 줄무늬(zebra-stripes)를 추가합니다.\\ ====예제====

Basic Table

The .table class adds basic styling (light padding and only horizontal dividers) to a table:

First Name Last Name Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
\\ =====Bordered Table===== ''.table-bordered'' 테이블과 셀의 모든 면에 테두리(borders)를 추가합니다.\\ ====예제====

Bordered Table

The .table-bordered class adds borders to a table:

First Name Last Name Email
John Doe john@example.com
Mary Moe mary@example.com
July Dooley july@example.com
\\ =====Hover Rows===== ''.table-hover'' 클래스는 테이블의 가로 행에 호버 효과(회색 배경색)를 추가합니다.\\ ====예제====

Hover Rows

The .table-hover class enables a hover state on table rows:

First Name Last Name Email
John Doe john@examle.com
Mary Moe mary@example.com
July Dooley july@example.com
\\ =====Condensed Table===== ''.table-condensed'' 클래스는 셀 패딩을 절반으로 줄여 테이블을 더 간결하게 만듭니다.\\ ====예제====

Condensed Table

The .table-condensed class makes a table more compact by cutting cell padding in half:

First Name Last Name Email
John Doe john@examle.com
Mary Moe mary@example.com
July Dooley july@example.com
\\ =====Contextual Classes===== 컨텍스추얼 클래스는 테이블 가로 행('''') 또는 테이블 셀('''')에 색상을 지정할 수 있습니다.\\ ====예제====

Contextual Classes

Contextual Classes can be used to color table rows or table cells. The classes that can be used are: .active, .success, .info, .warning, and .danger.

First Name Last Name Email
Default Defaultson def@somemail.com
Success Doe john@somemail.com
Danger Moe mary@example.com
Info Dooley july@wxample.com
Warning Refs bo@example.com
Active Activeson act@example.com
\\ 사용할 수 있는 컨텍스추얼 클래스는 아래와 같습니다.\\ | Class | Description | ^ ''.active'' ^ 테이블 가로 행이나 테이블 셀에 호버 색상을 적용합니다. ^ | ''.success'' | 성공 또는 긍정적인 작업을 나타냅니다. | ^ ''.info'' ^ 중립적 정보 변경 또는 작업을 나타냅니다. ^ | ''.warning'' | 주의가 필요한 경고를 나타냅니다. | ^ ''.danger'' ^ 위험하거나 잠재적으로 부정적인 작업을 나타냅니다. ^ \\ =====Responsive Tables===== ''.table-responsive'' 클래스는 반응형 테이블을 만듭니다.\\ 그러면 테이블이 소형 장치(768px 미만) 가로로 스크롤됩니다.\\ 너비가 768px보다 큰 화면에서 볼 때는 차이가 없습니다.\\ ====예제==== Basic Tables

Table

The .table-responsive class creates a responsive table which will scroll horizontally on small devices (under 768px). When viewing on anything larger than 768px wide, there is no difference:

# First Name lsdt Name Age City country
1 Anna Pitt 35 New York USA
{{tag>오션 Bootstrap Tables}}