웹페이지 표 모음

전체 선택

1. <TABLE> 태그로 만든 표

[샘플 101] <table>, <td> 태그를 이용한 세로 반복 표
점자출력

table, td 태그를 이용한 세로 반복 표

납부내역		납부 방법
월별	금액
1월	100	통장
2월	90	카드

 

[샘플 102] <table>, <th>, <td> 태그를 이용한 세로 반복 표
점자출력

table, th, td 태그를 이용한 세로 반복 표

운영체제	권장 브라우저	스크린리더
Windows	Internet Explorer	Sense Reader
	Internet Explorer / Firefox
MacOS	Safari	VoiceOver
iOS	네이버 앱 / Safari	VoiceOver
Android	네이버 앱 / Chrome	TalkBack

 

[샘플 103] <table>, <th>, <td> 태그를 이용한 크로스탭
점자출력

table, th, td 태그를 이용한 크로스탭

메뉴	가격	추가메뉴
돈까스	5,000원	밥, 샐러드
피자	16,000원	토핑, 치즈
보쌈	15,000원	고기, 김치

 

[샘플 104] 두 개의 표를 합하여 만든 세로 반복 표
점자출력

table, td 태그를 이용한 세로 반복 표

월일	내용	금액

1/20	입금	20,000
1/21	출금	12,000

 

[샘플 105] 머리글과 반복부, 행 그룹, 요약부로 구성된 반복표
점자출력

과목명	성적	평점
2019년도 1학기
국어	98	A+
영어	88	B-
합계		A
2019년도 2학기
수학	100	A+
과학	88	B-
합계		A++

 

[샘플 106] 사용자 지정 표
점자출력

국민기초생활수습자 증명서					처리기간
					즉시
수급자	성명	홍길동	주민등록번호	123425-1234654
	주소	서울 강서구 화곡3동
	세대주 성명	홍길동	세대주와의 관계	본인
용도		전기
제출처		한전
서울시 금천구 가산동 123번지 국민기초생활보장법 제2조제2호의 규정에 의한 수급자임을 증명하여 주시기 바랍니다. 2006년 06월 29일 신청인 홍길동 (서명 또는 인) 수급자와의 관계 본인 서울특별시 금천구청장 귀하
구비서류: 없음

 

[샘플 107] 표로 점역하지 않고 표의 셀을 텍스트처럼 점역한 표
점자출력

성명:	홍길동
주소:	서울시 금천구 가산동

 

[샘플 108] <table>, <td> 태그를 이용한 세로 반복 표(표 상단/하단 캡션)
점자출력
(단위: 원)

납부내역		납부 방법
월별	금액
1월	100	통장
2월	90	카드

(2020년도 기준)

 

2. DIV 태그로 만든 표

[샘플 201] grid style-sheet
점자출력

[샘플 202] table style-sheet
점자출력

[샘플 203] div layout
점자출력

[샘플 204] div layout
점자출력

 

3. UL, LI 태그로 만든 표

가. ul, li
점자출력