본문 바로가기

웹 코딩/HTML - CSS3

Bracket(브라켓) 확장 기능 설치하기 Bracket의 확장 기능은 유저들에 의해 개발되어 업로드되는 유용한 기능이며, 미리보기와 설명을 통해 기능 내용과 사용법을 알 수 있습니다. 현재 많은 확장 기능이 있지만, 대표적으로 Emmet, Beutify, Indent Guide, Open in browser 등으로 안내드리겠습니다. 확장 기능을 설치하는 방법 Bracket 실행 -> 확장 기능 관리자(이미지 참고) -> 검색 창에 검색 후 설치 1. Emmet : 자동 완성 기능 Emmet은 HTML, CSS문서 작업 시 없어서는 안될 정도로 유용한 기능으로 Tab을 눌러 태그 자동완성, 기본 틀 잡기 등에 사용됩니다. Emmet을 설치 후 html 문서형식으로 새파일을 생성하여 !를 입력 후 키보드 Tab을 누르면 HTML기본 구조가 자동 완.. 2020. 1. 21.
웹 에디터 프로그램 준비하기 이번 포스팅에서는 HTML을 배우기 이전에 웹 에디터 프로그램을 준비하겠습니다. HTML 문서를 작성하기 위해서는 편집 프로그램이 필요하며, 기본적으로 내장된 메모장이나 워드패드 등을 사용해도 되지만 조금 더 사용자에게 편리한 프로그램이 있습니다. 현재 웹 에디터 프로그램은 Notepad++, Atom, visual studio 등 많은 프로그램이 있지만 제 블로그에서 "Brackets"을 사용하여 포스팅을 할 예정입니다. Brackets의 경우에는 Adobe사에서 개발한 프로그램으로 다소 무거운 프로그램이지만 다양하고 업데이트되는 확장 기능으로 인해 작업의 편리성이 좋으며, 실시간으로 미리보기가 가능하다는 장점이 있습니다. 다운로드 링크↓ https://github.com/adobe/brackets/r.. 2020. 1. 20.
HTML이란? 이번 포스팅에서는 HTML은 무엇이고 어디에 쓰이는가에 대해 알려드리겠습니다. HTML은 "Hyper Text Markup Language"의 약자이며, 웹 문서를 만들기 위하여 사용하는 웹 언어의 한 종류입니다. 모든 웹 문서는 기본적으로 HTML로 제작하게 됩니다. 다만, 다른 프로그래밍 언어가 동원되어야만 우리가 흔히 보는 형태의 사이트가 만들어지게 되지요. HTML의 기본 구조는 아래와 같습니다. 지금은 위의 이미지를 보아도 그 의미와 기능에 대해 잘 이해가 되지 않을 것입니다. 하지만 제 블로그를 통해서 다양한 작업을 안내드리며 이후에 HTML이 무엇인지를 다시 한번 다루겠습니다. 2020. 1. 20.