kaki1013

# HTML5 개요 HTML5 : 웹 상에서 콘텐츠(content)를 구성하고 보여주기 위한 HTML 언어의 최신 표준 권고안 → HTML 4.01, XHTML 1.1 등을 대체하는 HTML의 차세대 표준 → XML이나 XHTML과는 달리 문법적으로 매우 유연하게 대처 다음과 같은 사항들을 모두 문법적으로 허용 - 태그 이름에 대문자 사용 - 속성값에 따옴표 생략 - 속성값 생략 - 빈 태그의 종료 태그(/) 생략 1. HTML5 문서의 기본 구조 DOCTYPE 선언이 매우 간단해짐 문법 문자셋(character set)의 선언도 매우 간단해짐 기본 문자 인코딩(character encoding) 방식 = UTF-8 # HTML5 변경사항 1. HTML5에서 추가된 요소 및 타입 - 의미(semantic..

# HTML과 CSS 1. CSS란? CSS(Cascading Style Sheets) : HTML 요소들이 각종 미디어에서 어떻게 보이는가를 정의하는 데 사용되는 스타일 시트 언어 → HTML4 부터는 이러한 모든 서식 설정을 HTML 문서로부터 따로 분리하는 것이 가능 → 오늘날 대부분의 웹 브라우저들은 모두 CSS를 지원함 2. CSS 적용 방법 (1) 인라인 스타일(Inline style) HTML 요소 내부에 style 속성을 사용하여 CSS 스타일을 적용하는 방법 → 해당 요소에만 스타일을 적용 인라인 스타일을 이용하여 스타일을 적용하였습니다. (2) 내부 스타일 시트(Internal style sheet) HTML 문서의 태그 내에 (3) 외부 스타일 시트(External style shee..

# Form 요소 사용자로부터 입력을 받거나, 사용자가 입력한 데이터를 서버로 보낼 때에 form 요소를 사용 문법 폼 핸들러(form-handler) : 전달받은 데이터를 처리하는 스크립트 파일 (서버 측의 웹 페이지) action 속성 : 폼 핸들러의 주소를 명시 method 속성 : 입력받은 데이터를 서버에 전달할 방식을 명시 → 사용자가 form 요소를 통해 입력한 데이터는 action 속성에 명시된 위치로 method 속성의 방식을 통해 전달 1. method 속성 method 속성을 통해 명시할 수 있는 form 요소의 전달 방식 → GET 방식 & POST 방식 방식 GET 방식 POST 방식 데이터 첨부 주소에 데이터(data)를 추가하여 전달하는 방식 데이터(data)를 별도로 첨부하여 ..

# 블록과 인라인 1. HTML 요소의 타입 display 속성 : 해당 요소가 웹 브라우저에 어떻게 보이는가를 결정(HTML의 모든 요소가 가짐) 대부분의 HTML 요소는 이러한 display 속성값으로 블록(block)과 인라인(inline)의 두 가지 값 중 하나를 가짐 2. 블록(block) 타입의 요소 언제나 새로운 라인(line)에서 시작 & 해당 라인의 모든 너비를 차지 p요소는 display 속성값이 블록인 요소입니다. 참고 : , , , , , 요소는 display 속성값이 블록(block)인 대표적인 요소 3. 요소 요소 : 다른 HTML 요소들을 하나로 묶는 데 자주 사용되는 대표적인 블록(block) 요소 → 주로 여러 요소들의 스타일을 한 번에 적용하기 위해 사용 div요소를 이용..

# HTML 스타일(Style) HTML 요소의 style 속성(attribute)을 이용하면 CSS 스타일을 HTML 요소에 직접 설정 가능 But 이러한 style 속성을 이용한 방법은 오직 단 하나의 HTML 요소에만 스타일을 적용 가능 문법 1. 배경색 변경 style 속성을 이용한 배경색 변경 2. 글자색 변경 style 속성을 이용한 글자색 변경 3. 글자 크기 변경 style 속성을 이용한 글자 크기 변경 4. 문단 정렬 변경 style 속성을 이용한 문단 정렬 변경 5. 여러 스타일의 설정 style 속성을 이용하여 여러 CSS 스타일을 한 번에 적용 가능 → style 속성값에 사용되는 CSS 속성(property)과 속성값들은 세미콜론(;)을 이용하여 구분 → CSS 속성을 하나만 사용..

# 제목(Heading) HTML은 제목을 표현할 수 있는 다양한 크기의 태그를 제공 가장 큰 태그부터 가장 작은 태그까지 다양한 크기로 제목을 표현 가능 태그의 위아래로는 약간의 여백이 자동으로 삽입됨 HTML 문서의 제목에 해당하는 부분을 태그나 태그를 사용하여 표현하지 않도록 주의 제목1의 크기입니다! 제목2의 크기입니다! 제목3의 크기입니다! 제목4의 크기입니다! 제목5의 크기입니다! 제목6의 크기입니다! 대부분의 웹 브라우저는 종료 태그를 사용하지 않더라도 HTML 문서를 제대로 표현해 줌 → 종료 태그가 없으면 예상치 못한 오류나 결과가 발생할 수도 있음 → XHTML이나 XML과 같은 문법이 엄격한 언어 : 종료 태그의 유무를 엄격하게 검사 → 가급적 종료 태그를 빠트리지 말고 코드를 작성하..

# HTML (HyperText Markup Language) HTML : 웹 페이지를 만드는 데 사용하는 언어 모든 태그는 미리 정의되어 있음 & 각각의 태그와 속성을 사용하기만 하면 됨 웹 페이지는 HTML 문서라고도 불림 & HTML 태그들로 구성됨 각각의 HTML 태그는 웹 페이지의 디자인이나 기능을 결정하는데 사용 # HTML 태그(tag) 태그 이름을 꺾쇠 괄호()로 감싸서 표현합니다. 보통 시작 태그(start tag, opening tag)와 종료 태그(end tag, closing tag)의 한 쌍으로 구성 종료 태그는 시작 태그와 전부 똑같지만, 태그 이름 앞에 슬래시(/)가 존재 문법 1. // 시작 태그 2. // 종료 태그 빈 태그(empty tag) : 등과 같이 종료 태그 없이..