분류 전체보기
-
[CSS] :first-child, :last-childProject/kakao-clone-v2 2019. 10. 31. 18:53
:first-child :first-child는 부모 요소 안에 있는 첫번째 자식만을 선택할 수 있는 선택자이다. :last-child 선택자 :last-child 선택자는 부모 요소 안에 있는 마지막 자식만 선택하는 선택자이다. 예제 소스코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 Document p:first-child { color: red; } ol li:last-child { background-color: aqua; } :first-child, last-child 첫줄 내용 입니다. 1번 2번 3번 Colored by Color Scripter cs
-
[CSS] PositionProject/kakao-clone-v2 2019. 10. 24. 16:46
Position 화면상의 element가 어디에 위치할 것인가 라는 것을 결정하는 주제 static(default) relative absolute fixed staic vs relative 다음과 같이 other, parent, me element가 있을 때 element들은 그림과 같은 position에 위치하게 된다. me의 style 속성에서 left와 top에 100px씩 값을 지정했지만 그 값들은 무시된다. element에는 CSS에서 기본적으로 적용되는 position 속성이 있는데 그 값이 바로 static이다. static은 offset을 무시하고 자기가 원래 위치해야 하는 곳에 정적으로 위치하게 된다. 즉, 위치와 관련된 설정을 하지 않은 상태라고 말한다. element를 자기가 있어야..
-
[CSS] box-sizingProject/kakao-clone-v2 2019. 10. 24. 14:23
box-sizing element의 크기를 지정할 때, 그 element가 padding이나 border나 이러한 값들을 가지고 있는 경우에 지정한 사이즈가 예상한 것과 다른 경우가 생긴다. 어떤 element의 크기를 예측하기 쉽도록 하는 방법으로써 box-sizing 이라는 속성에 대해서 알아보자. 같은 element에 각각 다른 border 크기를 주었을 때 두개의 element의 크기는 같아보인다. 그리고 content에 width 값을 150px로 지정을 했을 때 두 개의 크기는 다르게 느껴진다. 그 이유는 보통 element의 크기라고 했을 때 element 테두리의 바깥쪽 크기라고 생각하기 쉽지만 CSS 초창기에는 elememt의 content영역의 크기를 border와 padding이 빠진..
-
[CSS] Justify content and Allign itemsProject/kakao-clone-v2 2019. 10. 24. 03:23
Justify content와 Allign items은 item의 부모인 container level에서 가지는 속성들이다. 두 속성은 중심축과 교차축에 기준하여 items를 정렬하기 때문에 축을 이해하는 것이 중요하다. Justify-content Justify content는 items 들을 가로축을 기준으로 정렬한다. 예를들어, justify-content에 center 값을 주면 중심축을 기준으로 중앙으로 정렬된다. 1 2 3 4 5 .container { display: flex; flex-direction: row; justify-content: center; } cs Allign-items Align-items는 items들을 컨테이너의 세로축을 기준으로 정렬한다. 예를들어, align-it..
-
#0.1 Project SetupProject/kakao-clone-v2 2019. 10. 21. 17:37
1. Github Desktop 열고 File - New Repo - Name, Local path 설정하고 Create Repo 2. Visual Studio Code 에서 1번에서 설정한 Local path 폴더 열기 3. .gitignore 파일 만들고 비밀코드, github에 올리고 싶지 않은 파일 추가하기 4. 다시 Github Desktop로 돌아가서 .gitignore 파일 생성된거 확인하고 Publish Repo, 깃허브 상의 Remote Repo에 반영될 수 있도록 발행한다. 5. github.com/repo명으로 들어가면 Local PC에서 생성한 Repo가 깃허브상의 Remote Repo에도 생성된 것을 확인할 수 있다. 6. 그리고 새롭게 생성한 5개의 html 파일과 css 빈 폴더
-
BFS와 DFSAlgorithm/이론 2019. 10. 6. 17:58
BFS(Breadth-First Search) 너비 우선 탐색 이란 탐색을 할 때 너비를 우선으로 하여 탐색을 수행하는 탐색 알고리즘 - 시작 정점으로부터 가까운 정점을 먼저 방문하고 멀리 떨어져 있는 정점을 나중에 방문하는 순회 방법 - 최단 경로를 찾아준다는 점에서 최단 길이를 보장할 때 많이 사용한다. - Queue 자료구조를 사용한다. 알고리즘 1. 시작 노드를 큐에 삽입하면서 시작한다. 동시에 시작노드를 방문했다고 알리는 방문 처리 2. 큐에서 하나의 노드를 꺼낸다. 3. 해당 노드에 연결된 노드 중 방문하지 않은 노드를 방문하고, 차례대로 큐에 삽입한다. 4. 큐가 빌 때 까지 DFS(Depth-First Search) 깊이 우선 탐색이란 탐색을 함에 있어 보다 깊은 것을 우선적으로 하여 탐색..
-
GreedyAlgorithm/이론 2019. 10. 3. 00:45
그리디 알고리즘은 탐욕 알고리즘 또는 욕심쟁이 알고리즘이라고 불린다. 미래를 생각하지 않고 근시안적으로 각 단계에서 가장 최선의 선택을 하는 기법. 알고리즘 1. 해 선택(Selection Procedure) : 지금 당시에 가장 최적인 해를 구한뒤, 이를 부분해 집합에 추가한다. 2. 적절성 검사(Feasibility Check): 새로운 부분해 집합이 적절한지 검사한다. 3. 해 검사(Solution Check) : 새로운 부분해 집합이 문제의 해가 되는지 검사한다. 아직 문제의 해가 완성되지 않았다면 1번 부터 다시 시작한다. 그리디 알고리즘이 통하는 몇몇 문제들이 있다. 활동선택 문제 활동 선택 문제는 쉽게 말해 한 강의실에서 여러 개의 수업을 하려고 할 때 한 번에 가장 많은 수업을 할 수 있는..