반응형 HTML31 [HTML] HTML5 페이지 구조 HTML 5의 구조는 크게 헤더와 바디로 나뉜다 헤더는 웹 페이지의 타이틀, 링크 정보(CSS 파일, 폰트 등)이 주로 작성되고 바디는 실제 본문이 되는 부분으로 가장 많은 태그들이 작성되는 공간이다. 그러나 본 게시글에서는 대략적인 구조가 아닌 레이아웃(layout)에 대해 설명하도록 하겠다 element 명 element 표기 헤더 바디 내비게이션(메뉴) 사이드바 아티클 섹션(메인콘텐츠) 푸터 하나씩 차근차근 해보자! 헤더 헤더는 브라우저 탭에 표시되는 사이트 제목을 말한다. ▼ 푸터 푸터는 보여지는 단어처럼 header의 반대격인 foot에 위치한 다는 것이다. foot은 항상 아래쪽에 위치한다. ▼ 위의 결과에서는 footer의 위치가 위쪽에 있어서 무엇인지 파악하기 힘들것이다. 내 블로그의 fo.. 2019. 11. 21. [HTML] HTML 파일 Chrome에서 실행하기 목표: 작성된 파일(e.g. Test.html)을 Chrome 브라우저에서 실행하기 요약 Configure Tast 실행: ctrl + shift + p tasks.json 파일 생성 및 수정 MSBuild 실행 tasks.json 파일에 Chrome 설정 반영하기 파일 선택 후 실행 HTML Extensions 설치, HTML 사용하기는 아래 게시글 참고! 2019/11/20 - [놀고있네/HTML] - [HTML] VS Code - HTML Extensions 설치, HTML 사용하기 [HTML] VS Code - HTML Extensions 설치, HTML 사용하기 목표: VS Code에서 HTML 사용하기 요약 EXTENTIONS > [HTML] 검색 > HTML Snippets 설치 EXPLOR.. 2019. 11. 20. [HTML] VS Code - HTML Extensions 설치, HTML 사용하기 목표: VS Code에서 HTML 사용하기 요약 EXTENTIONS > [HTML] 검색 > HTML Snippets 설치 EXPLORER > Workspace 생성 .html 파일 생성 및 저장 HTML 작성 및 실행 MS에 Visual Studio Code를 설치하고, marketplace에서 extensions를 다운로드 받는 방법은 아래 게시글 참고 2019/11/15 - [놀고있네/VS Code] - [VS Code] Visual Studio Code 설치 및 실행 2019/11/16 - [놀고있네/VS Code] - [VS Code] 마켓플레이스 활용, 플러그인 다운로드, 서버 연결 [VS Code] 마켓플레이스 활용, 플러그인 다운로드, 서버 연결 2019/11/16 - [놀고있네] - [V.. 2019. 11. 20. [HTML] HTML 이란 HTML 이란 HTML은 하이퍼텍스트 마크업 언어(HyperText Markup Language)로 웹 페이지를 동작시키기 위한 언어이다. 더보기 마크업 언어(markup language)는 태그(tag) 등을 이용하여 문서나 데이터의 구조를 규칙화한 언어의 한 종류이다. 태그(tag)는 어떤 정보에 메타데이터로 부여된 키워드 또는 분류이다. 메타데이터(metadata)는 데이터에 관한 구조화된 데이터로 다른 데이터를 설명해 주는 데이터이다. HTML을 확인하고 싶다면 - 웹 페이지에서 키보드로 F12 버튼을 클릭하면 오른쪽과 같이 HTML과 BODY 정보를 확인할 수 있다. e.g. 냥장판의 스킨 편집에서도 [HTML 편집] 을 할 수 있는데 생각보다 우리의 웹활동과 밀접하게 관련이 있다! HTML 구.. 2019. 11. 19. 이전 1 2 3 4 다음 반응형
