Table
Table (테이블 컬렉션)
Table은 표 형태의 데이터를 시맨틱하게 보여주는 요소예요. 정의 테이블, 구조화된 테이블, 정렬 가능한 테이블 등 다양한 유형과 상태·변형을 제공해요.
출처: 문서
본문
Types (유형)
Table (테이블)
표준 테이블이에요.
Name (이름)
Age (나이)
Job (직업)
James
24
Engineer (엔지니어)
Jill
26
Engineer (엔지니어)
Elyse
24
Designer (디자이너)
Evidence Rating (근거 등급)
Effect (효과)
Efficacy (효능)
Consensus (합의)
Comments (의견)
A
Power Output (파워 출력)
80%
18 studies (18개 연구)
Creatine supplementation is the reference compound for increasing muscular creatine levels; there is variability in this increase, however, with some nonresponders.
A
Weight (체중)
100%
65 studies (65개 연구)
Creatine is the reference compound for power improvement, with numbers from one meta-analysis to assess potency
1
2
3
4
Employee (직원)
Correct Guesses (정답 개수)
Lena
Human Resources (인사)
22
Matthew
Fabric Design (패브릭 디자인)
15
Lindsay
Entertainment (엔터테인먼트)
12
Mark
Executive (경영)
11
Git Repository (Git 저장소)
node_modules
Initial commit (최초 커밋)
10 hours ago (10시간 전)
test
Initial commit (최초 커밋)
10 hours ago (10시간 전)
build
Initial commit (최초 커밋)
10 hours ago (10시간 전)
package.json
Initial commit (최초 커밋)
10 hours ago (10시간 전)
Gruntfile.js
Initial commit (최초 커밋)
10 hours ago (10시간 전)
Definition (정의)
테이블은 로우의 내용을 정의하는 첫 번째 컬럼을 강조하도록 포맷할 수 있어요.
Arguments (인자)
Description (설명)
reset rating
None
Resets rating to default value (평점을 기본값으로 재설정)
set rating
rating (integer)
Sets the current star rating to specified value (현재 별점을 지정된 값으로 설정)
Name (이름)
Registration Date (등록 날짜)
E-mail address (이메일 주소)
Premium Plan (프리미엄 요금제)
John Lilki
September 14, 2013
[email protected]
No (아니요)
Jamie Harington
January 11, 2014
[email protected]
Yes (예)
Jill Lewis
May 11, 2014
[email protected]
Yes (예)
Add User (사용자 추가)
Approve (승인)
Approve All (모두 승인)
rowspan 테이블 기법을 사용한다면, Fomantic은 스타일이 일관되게 유지되도록 보이지 않는 td 컬럼에 사용할 헬퍼 클래스 rowspanned를 제공해요.
Category rowspanned (카테고리)
Row one (로우 1)
Row two (로우 2)
Structured (구조화)
테이블은 복잡한 구조화 데이터를 표시하도록 포맷할 수 있어요.
Name (이름)
Type (유형)
Files (파일)
Languages (언어)
Ruby
JavaScript
Python
Alpha Team
Project 1 (프로젝트 1)
2
Beta Team
Project 1 (프로젝트 1)
52
Project 2 (프로젝트 2)
12
Project 3 (프로젝트 3)
21
States (상태)
Positive / Negative (긍정/부정)
셀이나 로우는 값이 좋은지 나쁜지를 사용자에게 알려줄 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
No Name Specified (이름 없음)
Unknown (알 수 없음)
None (없음)
Jimmy
Approved (승인됨)
None (없음)
Jamie
Unknown (알 수 없음)
Requires call (전화 필요)
Jill
Unknown (알 수 없음)
None (없음)
Cells (셀)
Error (오류)
셀이나 로우는 오류나 부정적인 값에 주의를 환기시킬 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
No Name Specified (이름 없음)
Approved (승인됨)
None (없음)
Jimmy
Cannot pull data (데이터를 가져올 수 없음)
None (없음)
Jamie
Approved (승인됨)
Classified (기밀로 분류)
Jill
Approved (승인됨)
None (없음)
Warning (경고)
셀이나 로우는 사용자에게 경고할 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
No Name Specified (이름 없음)
Unknown (알 수 없음)
None (없음)
Jimmy
Requires Action (조치 필요)
None (없음)
Jamie
Unknown (알 수 없음)
Hostile (적대적)
Jill
Unknown (알 수 없음)
None (없음)
Active (활성)
셀이나 로우는 사용자에 의해 활성화되거나 선택될 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
Jamie
Approved (승인됨)
Requires call (전화 필요)
John
Selected (선택됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Approved (승인됨)
None (없음)
Disabled (비활성)
셀은 비활성화될 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
Jamie
Approved (승인됨)
Requires call (전화 필요)
John
Selected (선택됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Approved (승인됨)
None (없음)
Colored Cells (색상 셀)
셀은 중앙 색상 팔레트의 색으로 스타일링할 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
No Name Specified (이름 없음)
Unknown (알 수 없음)
None (없음)
Jimmy
Recording session (녹음 세션)
None (없음)
Jamie
Unknown (알 수 없음)
Baby Party (베이비 파티)
Jill
Unknown (알 수 없음)
Vacation (휴가)
Marked (표시)
셀이나 로우는 색상 있는 왼쪽 또는 오른쪽 테두리로 표시할 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
No Name Specified (이름 없음)
Unknown (알 수 없음)
None (없음)
Jimmy
Recording session (녹음 세션)
None (없음)
Jamie
Unknown (알 수 없음)
Baby Party (베이비 파티)
Jill
Unknown (알 수 없음)
Vacation (휴가)
Colored and Marked (색상 및 표시)
색상이 있는 셀과 동시에 다른 색으로 표시(marked)된 셀이 필요하다면, 특정 클래스 순서를 따라야 하고 색상 클래스를 셀 색상에 추가해야 해요. 예를 들어 빨간색으로 색칠되고 파란색으로 우측 표시된 셀 같은 경우예요.
Name (이름)
Status (상태)
Notes (메모)
No Name Specified (이름 없음)
Unknown (알 수 없음)
None (없음)
Variations (변형)
Single Line (단일 줄)
테이블은 셀 내용이 한 줄에 유지되고 줄바꿈되지 않도록 지정할 수 있어요.
Name (이름)
Registration Date (등록 날짜)
E-mail address (이메일 주소)
Premium Plan (프리미엄 요금제)
John Lilki
September 14, 2013
[email protected]
No (아니요)
Jamie Harington
January 11, 2014
[email protected]
Yes (예)
Jill Lewis
May 11, 2014
[email protected]
Yes (예)
Fixed (고정)
테이블은 콘텐츠에 따라 테이블 셀 크기를 조정하지 않는 더 빠른 렌더링 방식인 table-layout: fixed를 사용할 수 있어요.
Name (이름)
Status (상태)
Description (설명)
John
Approved (승인됨)
John is an interesting boy but sometimes you don't really have enough room to describe everything you'd like
Jamie
Approved (승인됨)
Jamie is a kind girl but sometimes you don't really have enough room to describe everything you'd like
Jill
Denied (거부됨)
Jill is an alright girl but sometimes you don't really have enough room to describe everything you'd like
Name (이름)
Status (상태)
Description (설명)
John
Approved (승인됨)
This is much too long to fit I'm sorry about that
Jamie
Approved (승인됨)
Shorter description (더 짧은 설명)
Jill
Denied (거부됨)
Shorter description (더 짧은 설명)
Stacking (스택)
테이블은 테이블 내용을 반응형으로 스택하는 방법을 지정할 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
Selectable Row (선택 가능한 로우)
테이블의 로우는 선택 가능하게 보이도록 할 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
John
No Action (동작 없음)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
John
No Action (동작 없음)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
Selectable Cell (선택 가능한 셀)
테이블 셀은 선택 가능할 수 있어요.
Name (이름)
Status (상태)
Edit (편집)
John
No Action (동작 없음)
Edit (편집)
Jamie
Approved (승인됨)
Edit (편집)
Jill
Denied (거부됨)
Edit (편집)
John
No Action (동작 없음)
Requires change (변경 필요)
Jamie
Approved (승인됨)
Approve (승인)
Jill
Denied (거부됨)
Remove (제거)
Vertical Alignment (세로 정렬)
테이블 헤더, 로우, 셀은 세로 정렬을 조정할 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
Notes (메모)
1
2
Jamie
Approved (승인됨)
Notes (메모)
1
2
Text Alignment (텍스트 정렬)
테이블 헤더, 로우, 셀은 텍스트 정렬을 조정할 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
Striped (스트라이프)
테이블은 대비를 높이기 위해 번갈아 나타나는 로우의 콘텐츠에 더 어두운 색으로 줄무늬를 넣을 수 있어요.
Name (이름)
Date Joined (가입 날짜)
E-mail (이메일)
Called (연락함)
John Lilki
September 14, 2013
[email protected]
No (아니요)
Jamie Harington
January 11, 2014
[email protected]
Yes (예)
Jill Lewis
May 11, 2014
[email protected]
Yes (예)
John Lilki
September 14, 2013
[email protected]
No (아니요)
John Lilki
September 14, 2013
[email protected]
No (아니요)
Jamie Harington
January 11, 2014
[email protected]
Yes (예)
Jill Lewis
May 11, 2014
[email protected]
Yes (예)
John Lilki
September 14, 2013
[email protected]
No (아니요)
Celled (셀)
테이블은 각 로우를 별도의 셀로 나눌 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
3 People (3명)
2 Approved (2명 승인)
Basic (기본)
테이블은 가독성을 높이기 위해 복잡성을 줄일 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
Collapsing Cell (축소 셀)
셀은 필요한 만큼의 공간만 사용하도록 축소될 수 있어요.
node_modules
Initial commit (최초 커밋)
10 hours ago (10시간 전)
test
Initial commit (최초 커밋)
10 hours ago (10시간 전)
build
Initial commit (최초 커밋)
10 hours ago (10시간 전)
Column Count (컬럼 수)
테이블은 콘텐츠를 균등하게 나누기 위해 컬럼 수를 지정할 수 있어요.
Name (이름)
Status (상태)
Age (나이)
Gender (성별)
Notes (메모)
John
Approved (승인됨)
22
Male (남성)
None (없음)
Jamie
Approved (승인됨)
32
Male (남성)
Requires call (전화 필요)
Jill
Denied (거부됨)
22
Female (여성)
None (없음)
3 People (3명)
2 Approved (2명 승인)
Column Width (컬럼 너비)
테이블은 개별 컬럼의 너비를 독립적으로 지정할 수 있어요.
Name (이름)
Status (상태)
John
Approved (승인됨)
Jamie
Approved (승인됨)
Jill
Denied (거부됨)
3 People (3명)
2 Approved (2명 승인)
Collapsing (축소)
테이블은 로우가 차지하는 만큼의 공간만 차지하도록 축소될 수 있어요.
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
3 People (3명)
2 Approved (2명 승인)
Colored (색상)
테이블은 다른 테이블과 구분되도록 색상을 줄 수 있어요.
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Tomatoes (토마토)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
#### Inverted (반전)
테이블의 색상은 반전될 수 있어요.
```html
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
3 People (3명)
2 Approved (2명 승인)
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
Food (음식)
Calories (칼로리)
Protein (단백질)
Apples (사과)
200
0g
Orange (오렌지)
310
0g
#### Sortable (정렬 가능)
테이블은 사용자가 테이블 헤더를 클릭해 내용을 정렬할 수 있게 해줘요.
```html
Name (이름)
Status (상태)
Notes (메모)
John
No Action (동작 없음)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
3 People (3명)
2 Approved (2명 승인)
Full-Width Header / Footer (전체 너비 헤더/푸터)
정의 테이블은 첫 번째 컬럼이 남긴 공간을 채우는 전체 너비 헤더나 푸터를 가질 수 있어요.
Name (이름)
Registration Date (등록 날짜)
E-mail address (이메일 주소)
Premium Plan (프리미엄 요금제)
John Lilki
September 14, 2013
[email protected]
No (아니요)
Jamie Harington
January 11, 2014
[email protected]
Yes (예)
Jill Lewis
May 11, 2014
[email protected]
Yes (예)
Add User (사용자 추가)
Approve (승인)
Approve All (모두 승인)
Padded (패딩)
테이블은 가독성을 위해 더 많은 패딩이 필요할 때가 있어요.
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
He is a very nice guy and I enjoyed talking to him on the telephone. I hope we get to talk again.
Jamie
Approved (승인됨)
Jamie was not interested in purchasing our product.
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
He is a very nice guy and I enjoyed talking to him on the telephone. I hope we get to talk again.
Jamie
Approved (승인됨)
Jamie was not interested in purchasing our product.
Compact (컴팩트)
테이블은 한 번에 더 많은 로우를 보이도록 더 컴팩트해야 할 때가 있어요.
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Name (이름)
Status (상태)
Another Status (다른 상태)
Notes (메모)
John
Approved (승인됨)
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Approved (승인됨)
Requires call (전화 필요)
John
Approved (승인됨)
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Approved (승인됨)
Requires call (전화 필요)
John
Approved (승인됨)
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Approved (승인됨)
Requires call (전화 필요)
John
Approved (승인됨)
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Approved (승인됨)
Requires call (전화 필요)
Size (크기)
테이블은 작게 또는 크게 만들 수도 있어요.
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
3 People (3명)
2 Approved (2명 승인)
Name (이름)
Status (상태)
Notes (메모)
John
Approved (승인됨)
None (없음)
Jamie
Approved (승인됨)
Requires call (전화 필요)
Jill
Denied (거부됨)
None (없음)
3 People (3명)
2 Approved (2명 승인)
Scrolling (스크롤)
테이블 본문은 세로로 스크롤할 수 있어요.
You can also use resizable scrolling and a native resize drag handler will appear to the bottom right of the table body. This needs a modern browser, so does not work in IE11 or legacy Edge.
크기 조정 가능한 스크롤을 사용할 수도 있으며, 테이블 본문의 오른쪽 아래에 네이티브 크기 조정 드래그 핸들이 나타나요. 이 기능은 최신 브라우저가 필요하므로 IE11이나 레거시 Edge에서는 동작하지 않아요.
Name (이름)
Age (나이)
Job (직업)
James
24
Engineer (엔지니어)
Jill
26
Engineer (엔지니어)
Elyse
24
Designer (디자이너)
Daphne
24
Engineer (엔지니어)
Zoe
26
Engineer (엔지니어)
Kirk
24
Designer (디자이너)
Doug
24
Engineer (엔지니어)
Francis
26
Engineer (엔지니어)
Claire
24
Designer (디자이너)
Thomas
27
Engineer (엔지니어)
Clint
31
Engineer (엔지니어)
Alison
21
Designer (디자이너)
Rachel
19
Engineer (엔지니어)
Dave
23
Engineer (엔지니어)
Oliver
29
Designer (디자이너)
Sue
23
Engineer (엔지니어)
Jennifer
22
Engineer (엔지니어)
Zak
27
Designer (디자이너)
18 Entries (18개 항목)
Average age: 25 (평균 나이: 25)
2 Job-Types (2개 직업 유형)
스크롤 테이블은 선택적으로 미리 정의된 높이 long, very long, short, very short를 지원해요.
Name (이름)
Age (나이)
Job (직업)
James
24
Engineer (엔지니어)
Jill
26
Engineer (엔지니어)
Elyse
24
Designer (디자이너)
Daphne
24
Engineer (엔지니어)
Zoe
26
Engineer (엔지니어)
Kirk
24
Designer (디자이너)
Doug
24
Engineer (엔지니어)
Francis
26
Engineer (엔지니어)
Claire
24
Designer (디자이너)
Thomas
27
Engineer (엔지니어)
Clint
31
Engineer (엔지니어)
Alison
21
Designer (디자이너)
Rachel
19
Engineer (엔지니어)
Dave
23
Engineer (엔지니어)
Oliver
29
Designer (디자이너)
Sue
23
Engineer (엔지니어)
Jennifer
22
Engineer (엔지니어)
Zak
27
Designer (디자이너)
18 Entries (18개 항목)
Average age: 25 (평균 나이: 25)
2 Job-Types (2개 직업 유형)
Stuck (고정)
테이블은 헤더, 푸터, 첫 번째 또는 마지막 컬럼이 고정된 채로 가로 스크롤할 수 있어요.
Name (이름)
Age (나이)
Job (직업)
Job (직업)
Job (직업)
Job (직업)
Job (직업)
Job (직업)
Job (직업)
Job (직업)
Job (직업)
Job (직업)
Summary (요약)
James
24
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Accepted (승인됨)
Jill
26
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Accepted (승인됨)
Elyse
24
Designer (디자이너)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Pending (대기 중)
Daphne
24
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Accepted (승인됨)
Zoe
26
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Accepted (승인됨)
Kirk
24
Designer (디자이너)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Engineer (엔지니어)
Pending (대기 중)
Names:6 (이름: 6)
av.25 (평균 25)
Jobs : 2 (직업: 2)
Jobs : 2 (직업: 2)
Jobs : 2 (직업: 2)
Jobs : 2 (직업: 2)
Jobs : 2 (직업: 2)
Jobs : 2 (직업: 2)
Jobs : 2 (직업: 2)
Jobs : 2 (직업: 2)
Jobs : 2 (직업: 2)
Jobs : 2 (직업: 2)
2 Pending (2건 대기 중)
더 알아보기 (Learn more)
Table은 데이터를 담는 데 가장 많이 쓰이는 요소예요. sortable로 헤더 클릭 정렬을, selectable row/cell로 행 선택 상호작용을, stacking으로 모바일 반응형을 제공할 수 있어요. 색상과 상태 변형으로 긍정/부정/오류 값을 시각적으로 구분해 보세요.