css에서 > 표시는 무슨 의미 인가요? 정보
css에서 > 표시는 무슨 의미 인가요?본문
ul.oe_menu > li{
width:170px;
height:80px;
padding:0px;
float:left;
position:relative;
}
어제 메뉴 만들다가 IE6에서 li 가 가로로 나오지 않고 세로로 나오더군요
http://www.htmldrive.net/ 사이트에서 가져온 것 수정해서 만드려고 하는데...
수정하면서 만들다보니 원본 자체가 IE6에서는 float:left가 안되네요...
혹시나 해서 css에서 > 를 지워봤더니 IE 6에서도 가로로 정렬되더군요
처럼 > 표시가 들어간 것은 무엇인가요?
아무리 검색해봐도 '>'표시가 검색어 인식이 안되는지 관련 내용을 못찾겠네요
>는 없어도 되는 것인가요?
원본 주소: http://www.htmldrive.net/items/show/756/Scalable-Menu-with-jQuery-CSS3
원본은 데모페이지 들어가시면 보실 수 있어요
width:170px;
height:80px;
padding:0px;
float:left;
position:relative;
}
어제 메뉴 만들다가 IE6에서 li 가 가로로 나오지 않고 세로로 나오더군요
http://www.htmldrive.net/ 사이트에서 가져온 것 수정해서 만드려고 하는데...
수정하면서 만들다보니 원본 자체가 IE6에서는 float:left가 안되네요...
혹시나 해서 css에서 > 를 지워봤더니 IE 6에서도 가로로 정렬되더군요
처럼 > 표시가 들어간 것은 무엇인가요?
아무리 검색해봐도 '>'표시가 검색어 인식이 안되는지 관련 내용을 못찾겠네요
>는 없어도 되는 것인가요?
원본 주소: http://www.htmldrive.net/items/show/756/Scalable-Menu-with-jQuery-CSS3
원본은 데모페이지 들어가시면 보실 수 있어요
댓글 전체

> 있으면 자식, 없으면 자손?
맞나요?
하위버전에서는 안먹는 걸로 알고 있습니다.
맞나요?
하위버전에서는 안먹는 걸로 알고 있습니다.

>는 css 에서 상당히 중요한 selector 기능을 갖고 있는 부호 입니다.
바로 아래 내려오는 element 만 css 를 먹여주는 기능을 하는건데,
<div>
<p class="1">blah blah blah </p>
<p class="1">blah blah blah </p>
</div>
이렇게 html 이 있고 css 가
div > p.1 {color="red"} 이다
이러면 바로 아랫부분에 위치하는 <p> 만 빨간색으로 보여주는, static (정적인) 페이지에서보다는 dynamically (동적으로) element 가 생성되는 페이지에 주로 사용됩니다. 저 링크의 메뉴처럼 특정 li 에만 css 를 먹여야할때도 사용되구요.
자식/자손이라기 보다는, 맞아들, 둘째아들, 이런 비유가 더 옳겠네요.
동일한 클래스에 첫번째 element 에만 효과를 주는거다라고 생각하시면 됩니다.
바로 아래 내려오는 element 만 css 를 먹여주는 기능을 하는건데,
<div>
<p class="1">blah blah blah </p>
<p class="1">blah blah blah </p>
</div>
이렇게 html 이 있고 css 가
div > p.1 {color="red"} 이다
이러면 바로 아랫부분에 위치하는 <p> 만 빨간색으로 보여주는, static (정적인) 페이지에서보다는 dynamically (동적으로) element 가 생성되는 페이지에 주로 사용됩니다. 저 링크의 메뉴처럼 특정 li 에만 css 를 먹여야할때도 사용되구요.
자식/자손이라기 보다는, 맞아들, 둘째아들, 이런 비유가 더 옳겠네요.
동일한 클래스에 첫번째 element 에만 효과를 주는거다라고 생각하시면 됩니다.
맞아들 ㅋㅋ 아주 좋은 표현이십니다 +/_+
대신 IE6에선 지원 안합니다. ㅡ/.,ㅡ;;ㅋㅋㅋ
저렇게 표현시킨거 보아하니 li 하부에 다른 ul li가 종속될 수 도있어서 그렇게 한거같네용
가장 확실한 방법은 다른브라우저에서 > 넣고 안넣고 테스트 하실때
ul > li ul li
ul li ul li
이렇게 테스트해보시면 되겠네용 ㅋㅋ
대신 IE6에선 지원 안합니다. ㅡ/.,ㅡ;;ㅋㅋㅋ
저렇게 표현시킨거 보아하니 li 하부에 다른 ul li가 종속될 수 도있어서 그렇게 한거같네용
가장 확실한 방법은 다른브라우저에서 > 넣고 안넣고 테스트 하실때
ul > li ul li
ul li ul li
이렇게 테스트해보시면 되겠네용 ㅋㅋ
모두들 답변 감사합니다 많은 공부되었습니다!