본문 바로가기

html 강좌22

8.2 tbody, thead, tfoot 요소를 이용한 머리말, 본문, 맺음말 형태 만들기 8.2 tbody, thead, tfoot 요소를 이용한 머리말, 본문, 맺음말 형태 만들기 다음과 같이 하나의 테이블(table) 요소 안에 머리말(header), 본문(body), 꼬리말(footer)와 같은 구조로된 하나의 테이블 형태로 구성하여 나타낼 경우 다음과 같이 thead는 머리말, tbody는 본문, tfoot는 꼬리말에 적용하여 나타낼 수 있습니다. 실제 코드를 작성할 때는 table을 나타내는 table 요소 태그를 먼저 작성한 후 뒤이어 선택적으로 caption 요소 태그가 온 후 thead, tfoot 요소 태그를 작성하며 마지막으로 tbody 요소 태그를 작성해주면 됩니다. thead, tfoot, tbody 요소 안에는 행을 나타내는 tr 요소, 셀을 나타내는 td 요소 태그가.. 2013. 7. 31.
8. Tabular Data Elements 8. Tabular Data Elements 여러분들은 문서 작업을 하면서 워드나 한글을 통해서 표 형태를 사용하거나 엑셀 같은 스프레드 시트를 이용하여 표형태로 작성하는 다음과 같은 형태를 많이 보고 직접 작성했을 것입니다. 표(Table) 형태를 HTML5를 이용하여 웹 페이지에 나타내기 위해서는 위 그림을 토대로 표를 구성하는 기본적인 구성 요소들을 파악하는 것이 중요합니다. 위와 같은 하나의 테이블(Table)은 행(row)와 열(column)로 구성되며 행과 열이 만나는 부분을 셀(cell)이라고 합니다. 이 셀(Cell) 안에는 텍스트, 이미지 등이 나타날 수 있습니다. 위 표(Table)를 HTML5에서 사용하는 기본적인 요소(Element)들로 나타내보면 다음과 같이 나타낼 수 있습니다. .. 2013. 7. 31.
7.7 svg 요소(Element) 7.7 svg 요소(Element) svg는 Scalable Vector Graphics(SVG)의 약자로 XML 내에서 2차원 그래픽을 구현하는데 사용되는 언어입니다. SVG에서는 직원과 곡선 등을 표현하는데 사용되는 벡터(Vector) 그래픽과 이미지, 마지막으로 텍스트 3가지 타입의 그래픽 객체를 지원하는데 여기서는 간단하게 원, 직사각형, 이미지, 텍스트를 나타내는 예제를 알아봅니다. 첫 번째 예제는 원(circle), 직사각형(rectangle), 텍스트를 나타내는 간단한 예제입니다. 메모장을 열어서 HTML5 문서의 기본 태그들을 작성한 후 body 요소의 시작과 마침 태그 내에 다음과 같이 코드를 작성합니다. text 요소를 이용해서 나타낸 부분 text 요소를 이용해서 나타낸 부분 위에서 .. 2013. 7. 31.
7.6 math 요소(Element) 7.6 math 요소(Element) math 요소는 W3C에서 권고한 수학적인 마크업 언어인 MathML(Mathematical Markup Language)을 HTML 문서에서 사용할 수 있도록 하는데 사용되는 요소입니다. 여기서는 HTML5 웹페이지에 math 요소를 이용하여 수학적인 수식을 표현할 수 있는지 간단한 예제를 2개의 예제를 다루어보고자 합니다. 먼저 기본적으로 HTML5 페이지 내에서 math 요소를 이용하여 MathML을 사용하기 위해서는 다음과 같은 형식을 이용하여 접근을 합니다. MathML 코드 작성 이제 예제를 해볼까요? 첫 번째 예제는 “ + = “을 math 요소와 MathML을 이용하여 나타내는 예제입니다. 일단 코드부터 작성합니다. 메모장을 열어서 HTML5 문서의 기.. 2013. 7. 31.

티스토리툴바