Pseudo Classes (가상 클래스) ➡️ 선택자 끝에 붙여 상태를 특정하는 키워드 이것을 통해 체크된 체크박스나 커서를 올려둔 요소 등을 선택한다. 모디파이어 혹은 키워드는 :로 시작한다. 가상 클래스를 사용한다는 걸 알려면 :를 입력해야한다. 하이퍼링크 스타일링 /* Styling links */ a { color: #3a86ff; } 단순히 앵커 태그를 지정해서 하면 안된다. 대신에 앵커의 가상 클래스를 지정해서 하면 된다. 그래야 다른 상태를 타겟팅할 수 있기 때문이다. 스타일을 지정하려면 3가지 방법 link pseudo class (링크 가상 클래스) a:link { color: #3a86ff; } 기본적으로 모든 앵커 요소를 대상으로 한다. href 속성을 가지고 있다. 실제로 앵커를 ..
Init 현재 디렉토리를Git 레포지터리로설정하는 명령어 $ git init Git 리포지터리로 설정되면 숨긴 디렉토리로 .git 디렉토리가 생성이된다. .git 디렉토리에 git에서 필요한 파일들이 자동으로 생성 그리고 관리가 된다. 사용자는 .git이라는 디렉토리를 특별히 관리하지는 않는다. $ cd를 입력하면 mingw64 옆에 ~로 표시된다. 그것은 사용자 user 홈으로 돌아갔다는 뜻이다. $ mkdir git_test 임시 디렉토리를 생성하는 것 $ cd git_test/ Bash shell에서 자동완성은 Tab키 만약에 중복되는 file이 있을 경우 $ git init 입력후 bash shell을 보면 괄호 안에 master라고 적혀있다. 이때 master은 현재 경로 브랜치 명을 뜻한다. ..
Git Workflow Init Git의 리포지터리를 초기화하는 명령어 Status Git의 리포지터리에 현재 상태를 조회하는 명령어 Add Working 디렉터리에 있는 파일들을 staying area로 추가하는 명령어 Commit 스테이징 에어리아에 있는 파일들을 리포지터리 영역에 추가하는 명령어 Log 이전에 작성한 커밋이나 파일의 변경을 추적하는 명령어이다. Diff 이전 커밋과 현재의 디렉터리의 비교 등 특정 두개의 커밋을 비교하는 명령어 Branch 개발을 병렬적으로 진행하기 위해 필수적으로 필요한 branch (마지막 변경을 추적한다.) Tag branch와 유사하지만 특정 부분을 테깅처리 한다. Checkout branch를 이동하거나 특정파일을 내려받는것 Merge 병렬적으로 진행한 br..
https://git-scm.com/downloads Git - Downloads Downloads macOS Windows Linux/Unix Older releases are available and the Git source repository is on GitHub. GUI Clients Git comes with built-in GUI tools (git-gui, gitk), but there are several third-party tools for users looking for a platform-specific exp git-scm.com Git 사이트에 들어가 윈도우 운영체제면 모니터 안에 있는 "Downloads for windows"를 누른다. 기존 디렉토리에 설치하는 경우에는 특..
📌 Git? 👍 Git의 장점 네트워크 전송 속도 분산형이 아닐 경우 소스 커밋을 하기 위해 수작업으로 해야했기 때문에 번거롭다. 그래서 네트워크 연결되어 있어야 한다. 깃은 분산형 버전관리 시스템이 여서 네트워크가 연결되지 않은 환경에서도 로컬에서 커밋이 가능하다. 네트워크 연결된 환경에 가서 서버에 파일을 올리고 내려받기 가능하다. 로컬로 관리함으로 속도가 빠르다. 파일처리 hash 알고리즘을 사용하여 파일의 변경 여부 확인 가능 변경되지 않은 파일 경우 이전 파일에 대한 링크만 저장함으로 작은 파일 사이즈와 속도 처리가 빠르다. 동시 다발적인 개발 책임성 소스를 누가 올렸는지에 대해 확인 가능하다. 대형 프로젝트 효율적으로 지원 Branch 전략 깃은 branch를 생성하고 삭제하는데 편리하다. b..
CSS의 기본 규칙 selector { property: value; } ➡️선택자 뒤에 중괄호({})가 오고 설정하려는 특성이 나온다. 선택자의 종류는 많다. Universal Selector (전체 선택자) * { color: black; } ➡️페이지에 있는 선택 가능한 모든 요소들을 선택 가능하다. 스타일을 적용할 텍스타가 없는 요소들도 선택한다. Element Selector (요소 선택자) ➡️지정된 타입의 모든 항목을 선택한다. button { font-size: 40px; } Selector List ➡️쉼표를 사용해 목록에 있는 선택자 여러 개를 합치는 방법이다. h1, h2 { color: magenta; } id와 class를 사용하기 전, footer p { font-size: 16..
일반 텍스트 속성 text-align (텍스트 정렬) 가로 정렬을 설정하려면 text-align을 사용해야 한다. ➡️요소가 표시되는 위치를 정렬하는 게 아니라 요소 내적인 정렬을 의미한다. left(좌측 정렬) , center(가운데 정렬), right(우측 정렬) h1 { text-align: center; } font-weight (폰트 굵기) ➡️선택한 텍스트에서 주어진 부분의 굵기를 조정하는 것 font-weight: normal; font-weight: bold; font-weight: lighter; font-weight: bolder; font-weight: 100; font-weight: 900; 일반적으로 가장 흔한 굵기는 400;이다. text-decoration (텍스트 데코레이션)..
CSS 특성 h1 { color: purple; } 모든 을 선택하여 색상을 보라색으로 설정할 수 있다. color 속성은 배경색이 아니라 텍스트 색상을 바꿀 수 있다. background-color ➡선택한 요소들의 배경 색을 바꿔준다. CSS에서 ;(세미콜론)이 중요한 이유 CSS에서 명령을 내리거나 브라우저가 인식을 하기 위해서 ;(세미콜론)이 중요하다. ➡ ;(세미콜론)은 특성 선언을 마치고 다음 특성으로 넘어간다는 뜻이다.
CSS란? CSS(Cascading Style Sheets)는 스타일을 정하고 시각적으로 보이는 형태를 만든다. 프로그램 언어는 아니지만 문서를 시각적으로 표현하고 나태나기 위한 언어 즉 페이지에 입력된 HTML 콘텐츠를 시각적으로 표현한 것 CSS는 규칙이 중요하다. selector { property: value; } (특성, 콜론, 값, 세미콜론 순서이다.) 선택자가 있고 선택자 옆에는 중괄호가 있다. ➡ 선택자를 입력하고 특성을 설정한다. ➡ 특성을 선택하면 스타일이 정해진다. CSS를 올바르게 작성하는 방법 1. Inline styles | HTML 요소에 직접 스타일을 작성하는 것 ➡ 좋은 방법 X Hello World
