분류 전체보기
-
git 커맨드코드잇 2023. 12. 5. 22:07
git init 현재 디렉토리를 git이 관리하는 프로젝트 디렉토리(working directory)로 설정하고 그안에 레포지토리(.git 디렉토리) 생성 - 레포지토리 : 프로젝트 디렉토리의 각 버전이 담기는 저장소 git reset [파일 이름] git add를 하고 취소할 때 쓴다. 현재 staging area에서 파일 제거. working directory는 그대로 남아있음. git commit git commit -m "커밋 메시지" 로 커밋을 남길 수 도 있지만 -m 없이 사용도 가능하다. git commit 이라고만 쓰고 실행하면 커밋 메시지를 입력할 수 있는 텍스트 에디터 창이 뜬다. 커밋 메시지를 제목과 본문으로 길게 작성하고 싶을 때나, merge하고 git commit 커맨드만 써주면..
-
z-index: 9999로도 해결이 안되는 이유코드잇 2023. 12. 3. 14:09
z-index가 내맘대로 안될 때 먼저 z-index를 사용하기 위해선 position 속성을 부여해줘야 한다. (static 제외) .red { position: relative; z-index: 1; } z-index: 9999로도 해결이 안 되는 이유 .red { background-color: red; position: absolute; width: 100px; height: 100px; top: 0px; left: 0px; z-index: 1; } .green { background-color: green; position: absolute; width: 50px; height: 50px; top: 25px; left: 25px; z-index: 3; } .blue { background-col..
-
position - CSS코드잇 2023. 11. 26. 22:29
CSS position 속성은 문서 상에 요소를 자유롭게 배치할 때 쓴다. static 기본 값이다. 요소를 일반적인 문서 흐름에 따라 배치합니다. top, right, bottom, left, z-index 속성이 아무런 영향도 주지 않는다. relative 요소를 일반적인 문서 흐름에 따라 배치하고, 자기 자신을 기준으로 top, right, bottom, left의 값에 따라 위치를 적용할 수 있다. 이때 요소의 원래 자리는 그대로 차지하고 있다. // red는 top에서 20px 아래로 밀려나고, left는 30px 오른쪽으로 밀려난다. .red { position: relative; top: 20px; left: 30px; } 값이 모두 똑같은 경우 inset을 쓴다. 모든 방향에 대해서 20p..
-
CSS Cascading (우선순위)코드잇 2023. 11. 26. 21:19
CSS Cascading 우선 순위가 높은 규칙일 수록 우선적으로 속성을 적용한다. 스타일 시트의 순서 브라우저의 기본 스타일(user Agent Stylesheet)은 우선순위가 낮아서 사용자가 작성한 코드로 덮어 씌어진다. 개발자 도구에서 user agnet style이 브라우저 기본 스타일이다. 예시 ) 브라우저 기본 스타일보다 유저가 작성한 스타일시트가 우선순위가 높아서 h1은 15px로 적용된다. // 브라우저 기본 스타일 h1 { display: block; font-size: 13px; ... } // 유저가 작성한 스타일 h1 { font-size: 15px; } 참고로 html에 직접 작성하는 인라인스타일이 우선순위가 가장 높다. // style.css .login { background..
-
마진 상쇄 - CSS코드잇 2023. 11. 22. 19:11
마진 상쇄(margin Collapsing)는 html 태그끼리 세로 마진을 겹쳐서 더 큰 마진을 적용한다. 가로 마진은 겹치지 않는다. 위 아래 겹치는 태그는 마진 상쇄가 일어난다. 부모와 자식간의 태그인 경우 border나 padding이 있으면 마진 상쇄되지 않는다. - 위 아래 겹치는 태그 a b 세로로 연달아 있는 태그들이다. 이 둘의 마진을 겹치면 40px이 된다. - 부모 자식간에 margin만 있는 경우 (상쇄 됨) b d - 부모 자식간에 border가 있는 경우 (상쇄 안됨) b d border 테두리에 막혀서 margin 끼리 상쇄가 되지 않는다.
-
18장 함수와 일급 객체 | 모던 자바스크립트 Deep Dive모던 자바스크립트 Deep Dive 2023. 11. 18. 13:49
일급 객체 다음과 같은 조건을 만족하는 객체를 일급 객체라 한다. - 무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다. - 변수나 자료구조(객체, 배열 등)에 저장할 수 있다. - 함수의 매개변수에 전달할 수 있다. - 함수의 반환값으로 사용할 수 있다. 자바스크립트의 함수는 다음 예제와 같이 위의 조건을 모두 만족하므로 일급 객체다. // 1. 함수는 무명의 리터럴로 생성할 수 있다. // 2. 함수는 변수에 저장할 수 있다. // 런타임(할당 단계)에서 함수 리터럴이 평가되어 함수 객체가 생성되고 변수에 할당된다. const increase = function (num) { return ++num; }; const decrease = function (num) { return --nu..
-
17장 생성자 함수에 의한 객체 생성 | 모던 자바스크립트 Deep Dive모던 자바스크립트 Deep Dive 2023. 11. 16. 19:56
Object 생성자 함수 new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한다. // 빈 객체의 생성 const person = new Object(); // 프로퍼티 추가 person.name = 'Lee'; console.log(person); // {name: "Lee"} 생성자 함수(constructor)란 new 연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수를 말한다. 생성자 함수에 의해 생성된 객체를 인스턴스(instance)라 한다. 자바스크립트는 Object 생성자 함수 이외에도 String, Number, Boolean, Function, Array, Date, RegExp, Promise 등의 빌트인 생성자 함수를 제공한다. 반드시 Object ..
-
16장 프로퍼티 어트리뷰트 | 모던 자바스크립트 Deep Dive모던 자바스크립트 Deep Dive 2023. 11. 14. 21:41
프로퍼티 어트리뷰트와 프로퍼티 디스크립터 객체 자바스크립트 엔진은 프로퍼티를 생성할 때 프로퍼티의 상태를 나타내는 프로퍼티 어트리뷰트를 기본값으로 자동 정의한다. 프로퍼티의 상태란 프로퍼티의 값(value), 값의 갱신 가능 여부(wrtable), 열거 가능 여부(enumerable), 재정의 가능 여부(configurable)를 말한다. 프로퍼티 어트리뷰트는 자바스크립트 엔진이 관리하는 내부 상태 값인 내부 슬롯 [[Value]], [[Writable]], [[Enumerable]], [[Configurable]] 이다. 따라서 프로퍼티 어트리뷰트에 직접 접근 할 수 없지만 Object.getOwnPropertyDescriptor 메서드를 사용하여 간접적으로 확인할 수는 있다. const person ..