쿠카의 개발일지

.css 파일을 보면 꺽쇠 > 를 종종 보곤 합니다. 이 친구가 등장했을 때는 어떤 역할을 하는지 간단한 예제를 통해 알아보겠습니다. 우선 다음과 같은 html 코드 블럭이 있다고 가정하겠습니다. 이 상황에서, 다음과 같은 css 코드로 꾸며준다면 어떻게 될까요? 하위 선택자 사용 결과는 "안녕1", "안녕2" 모두 빨간색으로 표현됩니다. "아이디가 test인 요소 내 모든 p 요소들의 색상을 빨강으로 해줘"라는 의미가 되기 때문입니다. 반면, 다음과 같은 css 코드로 꾸며주면 "안녕1"만 빨강으로 표현됩니다. 자식 선택자 사용 이렇게 되는 이유는 #test와 p 사이의 꺽쇠(>) 때문입니다. 꺽쇠가 추가됨으로 위 css 코드는 #test 요소 내 p 요소들 중에 자식인 p 요소에 대해서 빨강색을 적용..

1. 기본 선택자 - $('h1').css('color', 'red'); - ('h1') 선택자와, css('color', 'red') 메서드 - 문서 객체를 다룰 때 사용하는 형태 - CSS 선택자와 유사 1.1. 전체 선택자 (Wildcard Selector) - * - HTML 페이지에 있는 모든 문서 객체를 선택 1.2. 태그 선택자 - 태그명 - 특정한 태그를 선택 1.3. 아이디 선택자 - #아이디명 - 특정한 id 속성이 있는 문서 객체를 선택 Header 1.4. 클래스 선택자 - .클래스명 - 특정한 class 속성이 있는 문서 객체를 선택 Header1 Header2 Header Header Header Header 2. 자손 선택자와 후손 선택자 - 기본 선택자의 앞에 붙여 사용 - ..