본문 바로가기

html5 책23

전체 공개된 HTML5, CSS3 and JavaScript 자료에 대한 목차 안녕하세요, 현재 성공회대학교 소프트웨어공학과 외래교수로 재직하며 C#, 데이터베이스, HTML5 등을 강의하고 있는 원철연입니다. 얼마 전 HTML5, CSS and Javascript 책 한 권 분량(500 페이지, A4 기준)을 모두 본 블로그에 공개했습니다. 전체 목차가 일목요연하게 정리된 게 없어서 스스로 학습하는데 조금 어려움이 있을 것 같아서 엑셀 파일에 전체 리스트를 다음과 같이 만들었습니다. 필요하신 분들은 보시고 학습에 조금이라도 도움이 되시기 바랍니다. 그리고 본 내용을 가지고 비상업적인 목적으로 활용하시고자 하시는 단체나 선생님은 소속,성명(담당자),이메일, 전화번호를 비밀로 남겨주시면 추후 HTML5 관련하여 업데이트가 있거나 강의시에 도움될 내용이 있을 경우 연락드리겠습니다. 감.. 2013. 8. 20.
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.