Programming/HTML 4

HTML5의 Semantic Tag

1. Semantic Tag란? - HTML4에서는 를 통해 화면을 구성 - HTML5에서는 "의미있는 태그"를 만들어 사용함 - 웹페이지 가독성을 높이고, 웹페이지 자체를 거대한 DB처럼 사용하기 위함 - 태그 이름만 다르고, 기능적인 차이는 없음 2. 암묵적 규칙 - 지키지 않아도 Error가 나지는 않지만, 권장되는 규칙 semantic tag 설명 header 헤더(문서의 머리 부분)을 의미 nav 문서 간의 이동을 담당하는 navbar를 의미 aside 본문 이외의 내용을 의미 section 본문의 여러 내용(article)을 포함하는 태그 article 본문의 주 내용을 의미 footer 문서의 밑 부분인 제작정보, 저작권 등을 표시

Programming/HTML 2022.03.13

2. HTML5 Markup Element

1. 포맷팅 Element - 텍스트에 특별한 의미를 부여하는 요소 tag명 설명 웹 문서나 포스트에서 참고 내용을 표시 공백, 줄바꿈등 입력한 그대로 화면에 표시 소스 코드 실행이 아닌 출력을 하고 싶을 때 사용 특정 문자열을 강조, 하이라이팅으로 표시됨 구분선 , 특정 문자열을 강조, 굵은 글씨로 표시됨 , 취소선, 밑줄 2. 목록형 Element - 목록 tag는 하나 이상의 하위 tag를 포함 tag명 설명 번호 없는 목록을 표시, 항목 앞에 심볼이 표시됨 ordered list, 번호 있는 목록을 표시 type 1 숫자(기본값) a 영어 소문자 A 영어 대문자 i 로마숫자 소문자 I 로마숫자 대문자 목록 항목으로 혹은 태그 하위에 사용 용어의 정의와 설명에 대한 내용을 목록화해서 표시 용어 목록..

Programming/HTML 2022.03.11

1. HTML 개요

1. HTML이란? - Hypertext Markup Language의 약자 - tag = 현재 문서가 HTML문서임을 정의 - 시작tag와 종료tag들의 집합으로 이루어진 문서 - 웹페이지의 "구조"를 담당 2. Web과 HTML의 작동원리 1. 클라이언트의 요청(URL) 2. 서버는 클라이언트의 요청을 분석하여 결과값(HTML)을 전송 3. 클라이언트는 전달받은 HTML을 Web Browser(내장된 엔진이 tag를 해석해서 화면에 나타냄)에 표시 3. HTML문서의 구성 - html, head, body tag로 구성 1. head 태그 - , , , , tag 포함 가능 - : 문서의 제목으로, 브라우저의 제목에 내용이 나타남 - : 문서의 작성자, 날짜, 키워드, 인코딩 정보 등 화면에 나타나지..

Programming/HTML 2022.03.09

HTML 요약

1. HTML 기초 1. HTML 문서 구조 2. 태그 분류 1) Block level element - 행 전체를 차지 ex) , , , , , 등 2) Inline level element - 요소 크기만큼 차지 ex) , , , , 등 3. 태그 종류 1) 시맨틱 태그(Semantic tag) : 의미를 가지고 있는 태그 ex) header : 소개, 제목, nav : 네비게이션, 메뉴바, section : 구간 나누기, footer : 사이트 정보 등 2) 텍스트 관련 태그 ex) h1~h6 : 제목, p : 본문, br : 줄바꿈, pre : html에 적은 그대로 출력 3) 링크 태그 ex) 4) 멀티미디어 태그 ex) 2. 테이블과 리스트 1. 테이블 1) 태그 : 표 전체를 감싸는 태그 :..

Programming/HTML 2021.02.08