🌱 속성 선언 순서CSS 문서의 가독성과 팀원들과의 협업을 위해 개인 또는 팀만의 규칙을 지키며 속성과 클래스명을 선언하는 것은 중요한 습관입니다.속성을 선언할 때 반드시 지켜야 하는 순서는 없지만, 일반적인 순서는 존재합니다. 세세한 순서를 지키기보다 전체적인 틀을 생각하며 작성한다면가독성 있는 문서를 작성할 수 있으며, 유지보수 시에 필요한 속성을 금방 찾아낼 수 있습니다. 개략적인 선언 순서는 다음과 같습니다.시각적/레이아웃박스 모델배경폰트 및 텍스트사용자 인터페이스그밖의 속성들 세부적인 선언 순서는 다음과 같습니다.시각적/레이아웃overflowvisibilitydisplaypositiontop/right/bottom/leftfloatclear박스 모델widthheightmarginpadding..
전체 글
🌳 레포지토리(Repository)레포지토리란 프로젝트의 모든 파일과 그것의 변경 이력(history)을 저장하는 곳으로, 저장된 위치에 따라 로컬 또는 원격 레포지토리가 있습니다.로컬(local) 레포지토리는 우리의 컴퓨터 안에 저장하는 공간이고,원격(remote) 레포지토리는 GitHub, GitLab, Bitbucket과 같은 서비스를 통해 인터넷에 호스팅된 저장 공간입니다. 레포지토리의 주요 기능으로는 모든 디렉토리와 파일의 버전을 관리커밋과 같은 모든 변경 이력(history)를 추적브랜치나 태그를 통해 여러 버전의 코드 베이스(code base)를 관리가 있습니다.코드 베이스(code base)란, 소프트웨어를 빌드할 수 있는 소스 코드가 저장된 저장소입니다.- 위키백과 🌳 브랜치(Bran..
🌳 정의DOM이란 Document Object Model의 약자로 문서 객체 모델을 의미합니다.한 마디로 웹 페이지에 나타나는 html 문서 전체를 객체로 표현한 것이라고 할 수 있습니다. DOM에서의 객체는 '노드(node)'라고 불리며html 태그 = 요소(element) 노드태그를 제외한 문자 = 텍스트(text) 노드주석 = 주석(element) 노드로 구성됩니다. 따라서 DOM을 활용하면 자바스크립트로 html 태그를 객체처럼 다룰 수 있게 됩니다. 🌳 DOM 트리html은 태그들이 계층을 이루고 있습니다.그리고 이 계층 구조는 DOM에서도 반영되며 이를 DOM 트리라고 합니다.DOM 트리는 노드로 구성되어 있으며 노드들은 서로 부모/형제/자식의 관계를 가집니다. 예를 들어, 아래와 같은 코..
🥕 사용 이유깃허브는 2021년 8월 13일부터 로컬에서 수행되는 깃 작업에 대해 비밀번호 인증을 더 이상 지원하지 않습니다.대신 개인 액세스 토큰(PAT)이나 SSH 키를 사용하여 인증을 진행해야 합니다. 개인 액세스 토큰(PAT)은 주기적으로 토큰을 재생성하고 업데이트하는 과정이 요구됩니다.그러나 SSH 키는 모든 레포지토리 접근 시 동일한 SSH 키를 사용하므로 한 번 등록해 둔 기기는 다시 인증할 필요가 없습니다. 따라서 이 글에서는 SSH 키를 생성하고 등록하는 방법에 대해 소개하겠습니다.$ 뒤에 작성되는 글은 직접 타이핑해야 하는 명령어이고, $ 없이 작성되는 글은 그에 대한 결과입니다.Git에서 제공하는 공식 문서는 해당 링크로 확인할 수 있습니다. 🥕 SSH 키 확인터미널에서 아래 명령..
🌱 블록(Block), , 등의 태그가 기본적으로 가지게 되는 속성입니다.자신의 부모 요소의 너비를 100% 꽉 채워 차지하므로나머지 요소들은 다른 줄로 밀어내고 한 줄을 온전히 혼자 차지합니다..special { width: 100%; height: 30px;}.login-btn { display: block; width: 30px; height: 20px; padding: 16px 0; text-align: center;}----------------------------------------------block1block2block3로그인width와 height, margin과 padding 속성을 모두 지정할 수 있으며아래에서 살펴볼 높이와 너비값을 지정할 수 없는 inline 속..
🌱 정의CSS에서 하나의 요소에 여러 개의 스타일이 지정되어 충돌이 발생할 때, 어떤 스타일을 우선적으로 적용할 지 결정하는 규칙CSS는 Cascading Style Sheet의 약자로, Cascade(종속, 작은 폭포, 계단식)는 여기서 가장 첫 번째로 위치한 단어인 만큼 매우 중요한 개념입니다. 개발을 진행하는 과정에서 여러 선택자를 사용하여 요소의 스타일을 지정하게 되는데, 같은 요소에 여러 스타일을 적용한 경우 내가 원하는 스타일이 적용되지 않는 상황이 발생할 수 있습니다.충돌이 발생한다고 해서 에러가 나는 것은 아니고, 충돌된 스타일 중에서 우선순위 및 가중치에 따라 무시할 스타일을 정하게 됩니다.이때 캐스케이드의 개념을 이해하고 있다면 어떤 스타일이 충돌된 것인지 찾아내어 제어할 수 있습니다..