개발노트

position으로 요소끼리 겹치는 것을 구현했더니.. 생각지 못했던 문제에 직면할 때가 있습니다. 이번시간에는 생각치 못한 간격이 발생했을 때 해결하는 방법에 대해서 알아봅니다. - 문제발생: img 위에 icon을 겹치게 만들기 위해서 position으로 왼쪽으로 이동 - 문제원인: position으로 이동한 후에도 icon이 원래 있었던 자리에도 공간을 차지함 이걸 없애는 방법은 간단합니다. width: 0; height: 0; 으로 만들어주면 끝!

HTML 마크업 언어를 작성하다 보면 CSS로 어떻게든 해보려고해도 아래와 같이 간격이 생깁니다. 이를 해결하는 방법으로 Reset이라는 CSS 파일을 html에 link로 연결 시켜주는 방법이 있습니다. 1. 접속하기 https://meyerweb.com/eric/tools/css/reset/ CSS Tools: Reset CSS CSS Tools: Reset CSS The goal of a reset stylesheet is to reduce browser inconsistencies in things like default line heights, margins and font sizes of headings, and so on. The general reasoning behind this was ..

"Live Server"는 VSCode IDE를 사용하여 html, css, javascript 로 웹을 개발한다면, 필수적으로 사용하게 되는 확장 프로그램입니다. 매번 소스를 수정하고 디버깅할 때마다 실행되어있는 웹을 종료하고 F5 버튼을 눌러 디버깅을 다시 실행하여 적용화면을 보고계신다면, "Live Server"를 사용해주세요. "Live Server"는 VS Code 확장 프로그램으로, 소스 변경 후, 저장(Ctrl + S)으로 웹을 종료할 필요없이 실시간으로 적용이 가능합니다. 1. Ctrl + Shift + X 버튼 이나 Extensions 카테고리를 클릭하여 Live Server를 설치합니다. 2. VS Code 재실행 후, index.html 편집창 우클릭 > Open with Live S..

HTML HyperText Markup Language의 약자로, 웹 페이지의 구조와 콘텐츠를 정의합니다. HTML을 사용하여 제목, 단락, 목록, 링크 등의 요소를 생성할 수 있으며, 이러한 요소들은 웹 페이지의 구조를 결정합니다. 또한, HTML은 웹 페이지의 시맨틱 마크업을 가능하게 하여 검색 엔진 최적화(SEO)를 할 수 있도록 합니다. 파일은 .html 로 작성되어야합니다. 1. Tag (태그) Hello Googling Developer 꺾쇠 괄호 (angle brakets) 안에 형식을 나타내는 p, h1, h2, img 등을 작성하여 시작태그를 열어줍니다. 닫을 때는 슬래시를 형식 앞쪽에 입력하여 종료태그로 닫아줍니다. 콘텐츠 내용은 시작태그와 종료태그 사이에 작성해줍니다. *와 같이 종료..