전체 글45 CSS 첫걸음 - 첫 번째 강의(2) 이전 글 첫 강의의 두 번째 이론인 CSS 작업 우선 순서이다. 이 글에선 이전 글처럼 배운 이론을 증명하거나 참조할만한 사이트를 공유하긴 어렵다. 본인이 이해한 내용은 어떠한 이론을 기반하여 설명했다기 보단 강사님의 실무 경험에 의한 이론 같다. 본인은 기존에 작업할 때는 레이아웃(마크업)을 전부 만들고 위치를 잡아가면서 작업했다면 강의에서는 가장 큰 레이아웃부터 만들기 시작한다. 그전에 어떤 결과를 만들어야 하는지 알아야 이해하기 쉬울 것 같다. 위와 같은 이미지를 만들 때의 작업 순서라 생각하면 될 것 같다. 1. 큰 틀부터 시작하기 강사님께서 과제 이미지를 보여주시며 본인에게 물으셨다. 저런 웹 사이트를 만들려면 무엇을 먼저 작업해야 하나요? 본인은 당연히 기존에 코딩했던 방식처럼 body 요소의.. 2022. 10. 9. CSS 첫걸음 - 첫 번째 강의(1) 빔캠프의 CSS 첫걸음!!! 기대하던 첫 번째 오프라인 강의를 참여했다. 강의를 듣고 정리를 해봤는데 정리하기 위해선 크게 두 분류로 나눠 이론과 css를 구분지어야 한다. 물론 이론도 나눠진다 첫 번째는 용어 정의고 두 번째는 css 작업 순서이다. 이 글과 다음 글에선 이론에 대한 내용을 정리하고 먼저 용어 정의부터 시작하겠다. HTML Element(요소) 보통 Element와 Tag를 구분 못 하는 사람이 많은데 Tag는 , 과 같이 start tag와 end tag로 짝지어 사용하는 Tag 또는 , 과 같이 start tag로만 구성된 Tag로 크게 두 형태가 있다. 짝지어 사용하는 Tag인 경우 children element(하위 요소)들을 가질 수도 있고 Text Element라고 불리는 요.. 2022. 10. 9. 코딩가나다 | CSS - 나 두 번째 나의 주제는 네거티브 마진이다. 강의의 시작은 코딩가나다 | CSS - 가에서 사용한 예제 코드를 기반으로 마진(margin)의 값을 조절하며 네거티브 마진을 사용하여 어떤 레이아웃을 구성할 수 있는지 보여주는 걸로 시작한다. body { background-color: #ddd; } .box { background-color: white; margin: 600px auto 0; width: 960px; text-align: center; /* 이 밑으론 디자인 적인 내용 (설명 없음) */ border-radius: 20px; border-right: 5px solid #ccc; border-bottom: 5px solid #999; } .box h1 { color: orangered; bor.. 2022. 10. 3. 코딩가나다 | CSS - 가 첫 번째 가의 주제는 가운데 정렬이다. 웹사이트(website)를 만들기 위해서 가장 먼저 해야 하는 것은 레이아웃(layout)이고 레이아웃 기법들 중 가장 보편적인 게 가운데 정렬이라고 한다. 예제 코드를 깃허브에다 올려놓긴 할 건데 이 글에도 남겨 놓겠다. CAT Lorem ipsum dolor, sit amet consectetur adipisicing elit. Corporis eaque animi distinctio ipsa modi adipisci molestias laborum velit optio, delectus, eveniet, harum libero minima mollitia commodi dolore dignissimos. Cumque, optio.L 예제로 쓰일 HTML 코드이.. 2022. 10. 2. 이전 1 ··· 3 4 5 6 7 8 9 ··· 12 다음