소개하는 거북이

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.

이번 장에서는 디스플레이 (Display)와 블록(Block), 인라인(Inline)에 대해 알아보겠습니다. ◈ 디스플레이 (Display) -> 요소를 블록으로 처리할지 인라인으로 처리할지, 자식(내부) 요소를 어떻게 배치할지 결정하는 레이아웃 설정 속성 값 디스플레이가 어떤 것인지 감이 안 오시죠? 일단, 블록과 인라인에 대해 먼저 설명하고 차근차근 알아보겠습니다 :) ◈ 블록 (Block) -> 화면의 가로 넓이만큼의 길이를 가진 직사각형 형태의 속성 항상 새로운 줄에서 시작됩니다. 블록 속성을 가지는 요소 옆에는 다른 요소가 올 수 없습니다. ◈ 인라인 (Inline) -> 해당 요소의 내용만큼의 넓이를 가진 속성 새로운 줄에서 시작되지 않습니다. 인라인 속성을 가지는 요소 옆에는 다른 요소가 올..

이번장에서는 클래스와 아이디에 대해 다뤄보도록 하겠습니다! 먼저, 아이디에 대해 정의해보겠습니다. ◈ ID (아이디) -> 하나의 문서에서 가질 수 있는 유일한 고유식별자 -> 요소를 가리킬 때, 특정 요소를 식별할 때 사용 무슨 말인지 이해가 가시나요? ID는 하나의 문서에서 가질 수 있는 유일한 고유식별자입니다. 즉, 한 문서당 하나의 ID만 존재할 수 있다는 것이죠! ID명을 중복해서 쓸 수 있습니다만, 나중에 골치 아파지기 때문에 매우 매우 비추천하는 방법입니다. 만약, html만 사용할 것이라면 ID 중복은 가능합니다. 예를 들어, div에 orange라는 아이디를 부여했다고 합시다. 그러면 라고 적을 수 있겠죠? 그리고 위의 div는 orange라는 고유한 값을 가지게 되는 것입니다. 만약, ..

이번 장에서는 CSS의 선택자 (Selector)에 대해서 알아보겠습니다! 일단, 선택자의 정의에 대해 알아보겠습니다. ◈ 선택자 (Selector) -> CSS를 적용시키기 위해 요소(대상)를 지정할 때 사용하는 것입니다. 선택자에는 다양한 종류가 있는데 저희는 이번 장에서 제일 기본이 되는 선택자들에 대해 학습해보겠습니다. 처음 배울 선택자는 전체 선택자입니다. ◈ 전체 선택자 -> 모든 요소를 선택하는 선택자 기본 구조 : * { contents; } 전체 선택자는 말 그대로 모든 요소를 선택하게 됩니다. 전체 선택자를 이용해 모든 요소에 teal이라는 색을 입혀보도록 하겠습니다! See the Pen QWGgXrv by JaeyongLee (@jaeyonglee960212) on CodePen. ..