- Meta태그란 - 문서의 정보를 설명하는 HTML head 태그 사이에 위치하는 태그 - 언어셋 설정, 렌더링, 뷰포트, SEO 최적화 등을 설정할 수 있는 태그 - Meta 태그 기본 구조 - - Meta 태그의 속성 - http-equiv : 웹 브라우저가 서버에 명령을 내리는 속성이며 name을 대신해서 사용이 가능 웹 서버에 전송 시에 의미를 가짐 - content : meta 정보의 내용을 가짐 - name : meta 정보의 이름을 지정을 할 수 있으며, 설정하지 않을 시에 http-equiv와 같은 기능 - 주로 쓰이는 Meta 속성 - -> 문자 인코딩을 설정하는 태그 - -> 웹 브라우저의 호환성을 설정하는 태그 - IE=edge : IE 8 이상을 호환하는 설정하는 태그(권장) - ..

- HTML5 이전에 레이아웃 구조 설정 - 위의 사진에 방법처럼 class또는 id 속성으로 설정을 많이함 - 현재로서도 이런식으로 많이 쓰이기도 함 - HTML5에 시멘틱 레이아웃 구조 설정 - 이러한 형태로 시멘틱 태그로 레이아웃을 설정을 할 수 있음 - Tag : 주로 머리글을 지정 -> class = "headeer" - Tag : container 영역 -> class="container" - Tag : 주로 메뉴로 설정 -> class="nav" - Tag : content 실제 내용을 적용 -> class="content" - Tag : 하단을 지정 회사정보, 저작권 등 -> class="footer"

- Tag - div 태그는 웹 페이지의 전체적인 레이아웃을 설정할 때 주로 사용 - 블록(block) 형태로 사용 - Tag - span 태그는 웹 페이지의 일부분을 설정할 때 주로 사용 - 인라인(inline) 형태로 사용 - 해당 태그의 내용을 웹 페이지의 출력 결과이며 웹 페이지 상에서는 두 개의 태그의 차이점이 없어 보임 - 확인을 위해서는 크롬에서 개발자 도구에 접속하면 해당 내용을 찍어보면 차이점을 확인이 가능 - div 태그를 확인했을 때는 문장이 짧아도 다른 영역까지의 폭을 차지하고 있는 상태 - span 태그를 확인했을 때에는 문장에 폭에 따라 문장 내용까지만 폭을 차지하고 있는 상태 - 속성 class와 id - HTML 태그에는 속성에는 class와 id로 주로 설정이 된다. - c..

- HTML이란? - Hyper Text Markup Language의 약자이다. - 웹 페이지에서 다른 페이지로 가지고 갈 수 있는 기능 - 즉, 웹 페이지의 뼈대이며, 프로그래밍 언어가 아닌 마크업 언어이다. - HTML 확장자 - 확장자는 파일명 뒤에 붙이는 이름 - HTML에 확장자는 .html, htm 이라는 확장자 포맷을 가지고 있다. - 시멘틱 마크업(Simantic Markup) - Simantic : 의미론적 - 즉, 개발자와 브라우저에게 의미있는 태그를 제공 - 시맨틱 마크업의 장점 - 접근성이 좋아짐 - SEO(Search Engine Optimization) - 코드 가독성이 좋아짐 - 코드와 재사용성이 좋아짐 - HTML 기본 용어 - 요소(Element) : - : Open 태그..