FRONT-END/HTML 3

Semantic

1. semantic? semantic의 사전적 의미는 '의미론적인', '의미가 통하는' 이다. 검색 로봇 또는 스크린 리더등의 기계가 쉽게 해석하고 분석 할 수 있도록 만들어진 태그 HTML4에서 와 id 속성을 이용하여 화면을 구성 id의 이름을 정하는 규칙이 없기때문에 문서의 구조를 이애하는데 한계. 웨어러블 장치나 스마트 기기를 이용하여 웹문서를 읽는 데 부적합 구조 해결책으로 HTML5에서는 웹 문서 레이아웃을 표준화하는 semantic tag를 이용 사이트의 제목과 로고, 검색 창 등이 있는 헤더, 여러 내용이 있는 본문, 본문 외 내용을 나타내는 사이드바, 저작권 정보와 제작자 정보를 표시하는 푸터로 이루어져 있다. 브라우저, 검색엔진, 개발자 모두에게 콘텐츠의 의미를 명확히 설명하는 역할을..

FRONT-END/HTML 2021.12.07

HTML 마크업 요소

1. 포맷팅 요소 포맷팅 요소에는 화면에는 동일하게 출력되지만 각 요소가 가진 의미가 다른 것이 있다. 예를 들면 와 은 모두 텍스트를 굵게 표현하지만, 요소는 텍스트를 강조 : 생략된 약어 표시, Title 속성을 함께 사용 : 연락처 정보 표시. : 긴 인용문구 표시, 좌우로 들여쓰기가 됨. : 짧은 인용문구 표시, 좌우 따옴표가 붙음. : 공백, 줄바꿈 등 입력된 그대로 화면에 표시 : 컴퓨터 인식을 위한 소스코드 : 특정 문자열을 강조, 화면에는 하이라이팅 됨. : 구분선 , : 굵은 글씨로 표시, 특정 문자열 강조 , : 이텔릭 표시, 특정 문자열을 강조 , : 큰 글자, 작은 글자로 표시 , : 위 첨자, 아래 첨자로 표시 , : 취소선, 밑줄 2. 목록형 요소 목록 tag는 하나 이상의 하의..

FRONT-END/HTML 2021.12.07

HTML 기본

1. HTML 기본 tag와 속성 class tag에 적용할 스타일의 이름 지정 dir 내용의 텍스트 방향을 지정 왼쪽 >> 오른쪽(기본값, ltr) 오른쪽 >> 왼쪽(rtl) id tag에 유일한 ID를 지정함. 자바스크립트에서 주로 사용. style 인라인 스타일을 적용하기 위해 사용 title tag에 추가정보를 지정. tag에 마우스 포인터를 위치시킬 경우 title의 값 표시 Root 요소 tag는 HTML 문서 전체를 정의 Head와 Body로 구성 Head 요소 문서 머리글, 제목 tag는 브라우저에게 HTML문서의 머리 부분임을 인식. , , , , tag를 포함 가능. tag는 문서의 제목을 의미, 브라우저 제목 표시줄에 tag내용이 나타남 tag 이외의 다른 tag로 표현한 정보는 화면..

FRONT-END/HTML 2021.12.07