본문 바로가기

html5 교재22

11.2 class, id, style 속성 11.2 class, id, style 속성 메모장을 열어 다음과 같이 글의 단락(절)을 나타내는 p 요소 3개를 이용하여 코드를 작성합니다. class 속성을 이용한 문장 id 속성을 이용한 문장 style 속성을 이용한 문장 위와 같이 작성하고 저장한 후 IE9를 이용하여 열어보면 다음과 같이 나타납니다. 이제 각각 class, id, style 속성을 이용하여 3개의 p 요소에 색상 및 정렬 위치를 설정하기 위해서 먼저 … 블록 안을 다음과 같이 수정합니다. class 속성을 이용한 문장 id 속성을 이용한 문장 style 속성을 이용한 문장 위에서 class 속성을 적용한 첫 번째 p 요소와 id 속성을 설정한 두 번째 p 요소는 현재까지는 아무런 변화도 발생하지 않습니다만 3번째 style 속성.. 2013. 7. 31.
10.4 menu 요소 10.4 menu 요소 menu 요소는 command의 목록이나 메뉴를 만들 때 사용하는 요소로 “list”, “context”, “toolbar”와 같이 메뉴의 타입(type)을 설정하는 type 속성과 메뉴에 대한 시각적인 라벨을 설정하는 label 속성이 사용가능하며 다음과 같은 형식으로 menu 요소를 사용할 수 있습니다. command, button … 방금 전 사용한 “commandEx.html”을 메모장으로 열어서 시작, 마침 태그 안에 코드를 다음과 같이 수정합니다. 새파일 파일 열기 파일 저장 위와 같이 작성한 후 “menuEx.html”로 저장하고 IE로 보면 다음과 같이 나타나며 각 메뉴를 클릭하면 설정된 대로 알림창이 나타나 메시지를 표시합니다. 실제로 새파일, 파일 열기, 파일 저.. 2013. 7. 31.
10.2 summary 요소 10.2 summary 요소 summary 요소는 details 요소의 헤더 즉 제목이나 타이틀을 설정할 때 사용하는 요소로 다음과 같은 형식으로 사용됩니다. details 요소에 사용될 제목(타이틀) 방금 전 사용한 “detailsEx.html”을 메모장으로 열어서 시작, 마침 태그 안에 코드를 다음과 같이 수정합니다. 교육 지식과 기술 등을 가르치며 인격을 기르는 것 위와 같이 수정한 후 다른 이름으로 저장을 눌러서 “summaryEx.html”로 저장한 후 Chrome으로 열어보면 다음과 같이 details 예제에서와는 다르게 summary 요소에서 설정한 “교육”이 나타나는 것을 알 수 있습니다. - 본 저작물은 본인이 2011년 상반기부터 2012년 여름 즈음까지 도서 출판을 목적으로 약 470.. 2013. 7. 31.
10. Interactive Elements 10. Interactive Elements HTML5에서 대화형 요소들(Interactive elements)은 웹 페이지에서 사용자가 키보드나 마우스 등과 같은 입력 장치 등을 이용하여 어떤 기능을 활성화하거나 상호 작용할 수 있도록 하는 요소들로 이를 이용하여 사용자가 추가적인 정보나 메뉴나 명령 등을 처리할 수 있으며 현재 W3C에서 대화형 요소들로 분류한 목록은 다음과 같습니다. 요소 기능 details 사용자에게 세부사항를 보여주거나 감출 때 사용 summary details 요소를 위한 헤더, 타이틀 기능을 제공 command 사용자에 의해 작동되는 명령 menu command의 목록이나 메뉴를 만들 때 사용 10.1 details 요소 details 요소는 세부 사항을 보여주거나 감출 때 .. 2013. 7. 31.