thead, tbody, tfoot을 사용하는 이유 > 웹스터디

Html&CSS&Script thead, tbody, tfoot을 사용하는 이유

페이지 정보

작성자 에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 댓글 0건 조회 20,324회 작성일 11-02-09 09:57

본문

특징

테이블 내에 다양한 테그 사용으로 접근성을 높이고 CSS에서 더 쉬운 참조를 위해 사용한다.
<table>테그 이외에도 <div>, <form>등에서 데이터의 효율적인 구성과 관리를 높이기 위해 사용된다.
Thead는 머리말 부분, tbody는 본문, tfoot는 꼬리말로 정의하여 thead~tbody~tfoot까지가 하나의 세트로 사용되고, 하나의 id로 CSS에서 관리될 수 있다.
효율성
<thead>는 <head>, <tbody>는 <body>, <tfoot>는 <foot>와 비슷한 의미로 사용되며, 이렇게 정의된 묶음 데이터는하나의 아이디로 관리되며, CSS에서 한번에 수정될 수 있다.
Thead,tbody,tfoot는 <table>테그에서만 사용되는 것이 아니고, 일반적으로 여러 개의 행을 하나의 그룹으로 묶어주는 역할을 하며, 어떠한 html페이지 내의 데이터에 대해 데이터적이니 의미를 부여하기 위하여 사용된다.
또한, 하나의 테그 내에서 사용되는 내용들(ex : vspacing, style="… ) 을 css파일에서 통합적으로 관리할 수 있고, 페이지를 로딩한 후 CSS에서 이와 같은 비쥬얼에 대한 부분을 처리함으로서 획일적(①데이터 로딩 ②비주얼 랜더링 처리)이고효율적인 랜더링 및 처리가 가능하다.
기존 테이블과 구분점
<table>테그는 기본적으로 복잡한 넓이 계산 알고리즘을 거쳐서 랜더링 되는데 이 알고리즘은 셀안의 컨텐츠와 셀에 지정된 넓이를 바탕으로 최적의 테이블 레이아웃을 계산하는 것이다.
보통 width를 정확히 지정해도 이가 나오지 않을 경우가 많은데, 이를 table-layout 속성을 이용해서 보완 할 수 있다.
Css에서 아래와 비슷한 형식으로 table-layout 을 지정한다.
Table{

Table-layout:fixed;

}
웹 접근성/장애인 과 thead의 관계
<thead>에 관련된 내용은 "장애인"과는 무관하다 판단하여 최종 가이드라인에서 제외되었음.
그러나, 표에서 th와 td를 구분하는 내용이 있으며, 게시판 등의 표에서 제목과 내용을 구분하라는 의미로 보임.
이는 코딩적인 부분에 크게 중점을 둔 것이라기보다는, 게시판 등에서 <th>테그를 통해 (제목들을)따로 처리하고, <td>테그를 통해 내용들을 따로 처리(여기서 처리란, 시각적인 처리와 데이터를 재사용하는 처리를 말함.)한다는 의미로 보임.
참조 URL
W3c의 표준 문서 : http://www.w3.org/tr/wd-html40-970708/s ··· les.html
<table>테그 내의 <thead> 사용의 예와 정보 : http://www.cyworld.com/jutlper/315594
HTML 5에서 thead의 설명 : http://dev.w3.org/html5/spec/overview.h ··· -element
서울시 웹 표준 가이드 : http://waf.seoul.go.kr/accessibility/ac ··· _01.html

댓글목록

등록된 댓글이 없습니다.

Total 268건 12 페이지

웹스터디 목록
번호	제목	글쓴이	조회	날짜
48	Html&CSS&Script 부분인쇄 하고싶을때	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	16068	03-07
47	ASP&ASP.NET Trim() 활용	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	16264	03-03
46	PHP replace php버젼	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	24986	03-03
45	PHP PHP에서 MYSQL 접속테스트	에렐리안 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	24748	03-03
44	MSSQL Update Query	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	25716	02-11
43	Html&CSS&Script FCKeditor 이미지 사이즈보정	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	17254	02-10
42	MSSQL SQL 쿼리	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	26026	02-10
41	MSSQL MSSQL 문자열 함수정리	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	24953	02-10
40	PHP PHP 함수정리	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	26637	02-10
39	ASP&ASP.NET asp 함수모음	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	18410	02-10
열람중	Html&CSS&Script thead, tbody, tfoot을 사용하는 이유	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	20325	02-09
37	MSSQL 자료검색 쿼리 간단하게 +_+	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	22937	02-07
36	ASP&ASP.NET Split/Ubound/Request.form 을 이용한 중복입력처리	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	19500	02-07
35	MSSQL mssql 테이블 복사 쿼리	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	22853	02-01
34	Html&CSS&Script FCK EDITOR 설치 또는 삽입	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	17060	01-25
33	ASP&ASP.NET asp br 처리	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	20104	01-24
32	ASP&ASP.NET 날짜계산	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	16501	01-24
31	ASP&ASP.NET history.back();	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	16331	01-19
30	Html&CSS&Script 입력폼 경고창(alert) 띄우고 해당 텍스트입력(input)창으로 이동시키기	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	23317	01-14
29	MYSQL Mysql 날짜관련 함수 모음	에렐리앙 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물	23450	01-14

게시물 검색

EREL WORLD