전체 글(404)
-
특수문자의 수치문자 참조와 문자실체 참조
표현문자 수치문자 참조 문자실체 참조 설명 - �- - 사용하지 않음 space - 수평탭 space - 줄 삽입 - - - 사용하지 않음 space - 여백 ! ! - 느낌표 " " " 따옴표 # # - 숫자기호 $ $ - 달러 % % - 백분율 기호 & & & Ampersand ' ' - 작은 따옴표 ( ( - 왼쪽 괄호 ) ) - 오른쪽 괄호 * * - 아스트릭 + + - 더하기 기호 , , - 쉼표 - - - Hyphen . . - 마침표 / / - Solidus (slash) 0 - 9 0-9 - 0부터 9까지 : : - 콜론 ; ; - 세미콜론 > > 보다 큰 ? ? - 물음표 @ @ - Commercial at A - Z A-Z - A부터 Z까지 [ ..
2017.10.13 -
3-8. 각종 목록을 표현하는 요소
1. 일반적으로 목록작성에는 요소(비순차적 목록 unordered list)또는 요소(순차적 목록 ordered list)를 사용하며, 각 항목은 요소(list item)로 정의합니다. , 요소 모두 블록 레벨 요소이며, 이외의 요소를 포함할 수 없습니다. 요소 또한 블록 레벨 요소로서 인하인 요소와 텍스트를 포함할 수 있고, 또 다른 블록 레벨 요소를 포함할 수 있습니다. 또, 정의형 목록을 표현하는 요소(definition list)가 있는데, 이는 , 요소를 포함합니다. 요소는 특정 요소를, 요소는 그레 대한 정의를 지정하는 것이 일반적입니다. 2. 비순차적 목록 ul요소 2-1. 요소를 활용한 메뉴제작 소스코드 Main menu About Services Portpolio Contact US -실..
2017.10.12 -
3-7. 인용문, 정형화된 텍스트 알아보기
1. 인용문 알아보기 다른 사람의 말이나 글, 혹은 다른 소스를 인용하는 경우에 사용하고, 블록 요소로는 , 인라인 요소로는 요소를 활용할 수 있습니다. 정형화된 텍스트의 표현은 요소를 활용하며, 요소나 없이도 줄바꿈이나 공백이 유지되는 특징이 있습니다. 1-1. 요소는 브라우저에서 들여쓰기의 형태로 출력됩니다. "cite"속성으로 해당 컨텐츠의 출처를 나타내고, 요소로 내용을 파악합니다. - 소스코드 1-1. 다음은 "웹 접근성 연구소"에서 정리한 웹 접근성 정의내용입니다. 월드와이드웹(World Wide Web)을 창시한 팀 버너스 리(Tim Berners-Lee)는 웹이란 "장애에 구애 없이 모든 사람들이 손쉽게 정보를 동유할 수 있는 공간"이라고 정의하였스며, 웹 컨텐츠를 제작할 때에는 장애에 구..
2017.10.11 -
3-6. 제목, 문단, 연락처정보, 구분선 알아보기
1. 레이아웃을 먼저 잡아야만 하는 것은 아닙니다. 누구는 각각의 요소를 먼저 만든 후에 레이아웃을 지정하기도 하고 누구는 레이아웃을 먼저 작성하기도 합니다. 중요한 것은 완료된 코드가 누가 봐도 체계적이고 알기 쉬운 코드로 만들어졌느냐 입니다. 2. 제목을 작성하는 방법 레이아웃을 작성하는 예를 들면서 제목 작성하는 방법을 보여드렸는데요. 문서를 마크업하는 경우에 빠뜨리지 말아야 할 요소가 바로 제목 요소(~)입니다. 문서 전체의 제목을 나타내는 요소고 중요합니다. 본문의 가장 큰 제목을 의 내용으로 적용하면 되는데, 메인 페이지의 경우에는 로고를 의 내용으로 적용하는 것이 좋습니다. 2-1. 제목요소는 이 가장 큰 제목이고 ~까지 지정할 수 있습니다. - 소스코드 Heading1 Heading2 He..
2017.10.10 -
3-5. HTML5 섹셔닝 요소들의 활용
1. 우리는 보다 좀 더 시멘틱(Semantic)한 마크업을 활용할 수 있습니다. HTML5에서는 section, nav, article, aside 등의 섹셔닝 요소들로 레이아웃을 작성하고 여기에 h1~h6 요소들로 해당 섹션의 제목을 작성하게 됩니다. 물론 여전히 요소도 쓰이지만 이전보다는 확실히 그 사용빈도가 줄었습니다. -소스코드 LOGO MAIN MENU ABOUT Company info -실행결과 HTML5에서는 섹셔닝 요소 안에 작성하는 요소를 부터 시작하는 것이 좋습니다. 좀 생소해 보일 수도 있겠지만, 브라우저는 이런 경우 문서의 구조를 정확히 판단하는 능력을 가지고 있습니다.
2017.10.08 -
3-4. Div 요소로 작성하는 문서의 그룹화 방법
1. 문서를 만들 때 어려운 점은 원하는 레이아웃을 만드는 작업이었습니다. 몇 년 전까지만 해도 요소를 활용해서 레이아웃을 만들었고, 최근엔 요소로 묶은 후 CSS를 활용해 레이아웃을 만들고 있습니다. 요소를 활용해서 문서를 묶어주는 방법을 그룹화한다고 합니다. 문서를 만들어보기도 전에 그룹화하는 방법부터 알아보는 이유가 뭘까요? 사실 HTML5로 발전하는 과정에서 그룹화의 의미가 바뀌게 되었습니다. HTML5부터는 원래 가 담당하던 그룹화 작업을 새롭게 섹셔닝 요소들이 담당하게 되었고, 그룹화라는 용어도 블록 요소 중에서 p, hr, pre, blockquote, ol, ul, li, dl, dt, div 등에 그 역할을 넘겨주게 되었습니다. 웹 페이지를 레이아웃에 맞춰 그룹화 작업을 하는 경우 적절한..
2017.10.08