CSS

[selector] CSS - element>element 자식선택자 ★ - 직접 자식요소만 선택. (요소선택자, IE7)

목차

  1. element > element 예제 - 자식선택자
  2. element > element 정의
  3. element > element 구문
  4. element > element 이슈 - 속도 느린 편

 

element > element 예제 - 자식선택자

※ div 안의 직접 p요소만 선택. (※ 직접 자식 아니거나 div 밖은 해당 X)
 
<style>
div > p {color:red;}
</style>
 
<div>
    <p>홈짱닷컴</p>
    <p>Homzzang.com</p>
    <blockquote>
        <p>홈페이지 제작관리 강의</p>
    </blockquote>
</div>
<p>그누보드 영카트 강의</p>

 

element > element 정의 


지정요소 (예:div) 안의 특정 직계 자식요소(예: p) 선택. 
 

 

1.
「자식선택자」라고도 함.
 
2.
CSS버전: CSS2
 
3.
IE7 이상 최신 브라우저 모두 지원.
 
 

element > element 구문

 

element > element { css 선언; }

 

PS. > 기호 앞뒤 공백 유무는 무관. (예제)

 

element > element 이슈 - 속도 느린 편

 
자손선택자보단 빠른 편이나, id / class 선택자에 비해선 느린 편임.
 


분류 제목
gradient CSS - repeating-linear-gradient () 함수 - 반복 선형 그레이디언트 ※ 패턴 배경
image CSS - object-fit 속성 - 컨테이너에 맞게 '이미지/비디오' 크기 조정 방법 지정 (= obje…
border CSS - border-image-source 속성 - 테두리 이미지 주소 (= border-image-so…
border CSS - border-right 속성 - 테두리우측일괄 (= 테두리오른쪽일괄 = border-right속성…
pagination CSS - 페이징 - 가운데 정렬 (Centered Pagination)
animation CSS - animation-timing-function 속성 - 애니재생중속도변화 (= 움직임 중 속도변경…
border CSS - border-left-style 속성 - 테두리좌측모양 (= 테두리왼쪽모양 = border-lef…
border CSS - border-image-width 속성 - 테두리 이미지 너비 (= border-image-wid…
border CSS - border-right-color 속성 - 테두리우측색상 (= 테두리오른쪽색상 = 테두리우측색깔…
border CSS - border-top-style 속성 - 테두리상단모양 (= 테두리상단스타일 = border-top…
color CSS - RGBA , HSL , HSLA , opacity - (색상코드)
transform CSS - backface-visibility 속성 - 3D요소 뒷면 노출 여부. (= backface-vi…
border CSS - border-right-width 속성 - 테두리우측두께 (= 테두리우측너비 = 테두리오른쪽너비 …
image CSS - Image Text - (이미지 위에 텍스트 배치/띄우기)
selector CSS - :disabled 가상선택자 - 비활성화 된 요소 선택 (= 실행불능요소 = 작동불능요소 = :d…
19/35
목록
 홈  PC버전 로그인 일본어
그누앞단언어
그누뒷단언어
그외코딩언어
그누보드
제작의뢰
Q&A
커뮤니티
웹유틸
회원센터
홈짱닷컴 PC버전 로그인