CSS23 css 기초3 가상 클래스 hover,active,nth-child 등 # 가상 클래스 1.HOVER ABC:hover 선택자 ABC요소에 마우스 커서가 올라가 있는 동안 선택 좀 더 쉽게 표현하자면, ABC요소에 대해서는 마우스 오버가 되어있는 동안에는 작동된다. 예시 a:hover 2.ACTIVE ABC:active 선택자 ABC 요소에 마우스를 클릭하고 있는 동안 선택 hover와 다른점은 마우스 오버가 아닌 ‘클릭’이라는 점이다. 예시 a:active 3.FOCUS ABC:focus 선택자 ABC 요소가 포커스 되면 선택 이것도 기본 기능은 active와 동일하다. 차이점은 input의 경우 정보 입력을 위해 마련된 공간안에서 쓰인다는 점 같고 active의 경우는 하이퍼링크 같은 원리로 작용하는 것 같다. 다시 말해서 focus는 활용이 가능한 요소인 input등에.. 2022. 9. 5. css 기초2 복합 선택자 # 복합 선택자 1)ABCXYZ - 일치 선택자 선택자 ABC와 XYZ를 동시에 만족하는 요소 선택 예시 ul.orange 2)ABC > XYZ - 자식 선택자 선택자 ABC의 자식요소 XYZ선택 예시 ul > .orange 3)ABC XYZ - 하위(후손)선택자 사실상 2)와 기능은 같다. 예시 ul .orange 4)ABC + XYZ - 인접 형제 선택자 선택자 ABC의 다음 형제 요소 중 XYZ를 선택 이 개념이 설명이 없다면 약간 난해하다. 예시 .orange + li 오렌지 망고 이렇게 있을때, 선택자 적용은 망고에만 된다. 이유는 선택자 ornage클래스의 다음 형제줄에 나오는 것 중에서 li가 있는 것이 망고 이기 때문이다. 5)ABC ~ XYZ - 일반 형제 선택자 선택자 ABC의 다음 형.. 2022. 9. 5. css 기초1 기본 선택자 (html에 작성된 것중 어떤것에 css 속성을 입히는지) 1. ABC - 태그 선택자 2. .ABC - 클래스 선택자 3. #ABC - 아이디 선택자 4. * - 전체 선택자 2022. 9. 5. 이전 1 ··· 3 4 5 6 다음