리 : 호버 초보자의 발언

내가 가진 div의 내부 리튬 요소 : 나는 리튬 요소 위에 마우스를 올려 효과를 적용리 : 호버 초보자의 발언

<ul id="tabs"> 
    <li id="tab-1"> <div id="xxx"></div> </li> 
    .... 
</ul>

CSS의 경우 예상대로 효과, 리튬에 적용

#tabs li:hover {....}

및 자식 DIV, 내가 리와 대장 사이

#tabs li :hover {....}

한 공간을 만들 경우

효과는 하위 항목에만 적용됩니다.

정상입니까? 저는 스크립트 초보자이며 다른 튜토리얼을 읽음으로써 스크립트가 실행될 때 공백이 달라지지 않는다는 인상을 받았습니다. 크롬, 사파리 및 파이어 폭스에서 이것을 테스트했습니다.

출처

2012-01-07 vucibatina

HTML과 CSS는 스크립팅 언어가 아니라 마크 업 언어입니다. 그들은 아무것도 실행하지 않고 아키텍처와 스타일을 설명합니다. – Rob

#tabs li :hover {....} = #tabs li *:hover {....} (* = universal selector).

공백은 하위 선택자를 구분합니다. 복수 선택자를 연결할 때 의미가 있습니다.

<div class="foo">을 선택하지만 <a class="foo"> 또는 <div>을 선택하지 않으려합니다. 올바른 셀렉터는 div.foo (요소 <div>, 클래스 foo)입니다.

점 앞에 공백을 추가하면 foo 인 요소 (<div>)를 선택하게됩니다.

위로 상황.

<div id="tabs"> #tabs     #tabs 
    <li>   li:hover    li 
     <div>  div     *:hover 
       = #tabs li:hover div = #tabs li *:hover

출처

2012-01-07 15:37:21

주 : 공백은 ** 모든 ** 하위 항목을 선택합니다. 직접 자식을 일치 시키려면'>':'#tabs> li : hover> div' –

Tnx를 사용하십시오. 지금은 감각이 있습니다. – vucibatina

@ user1136011 * (편집 된 질문에 대한 의견) * 코드 블록은 4 개의 공백이있는 텍스트 접두어로 표시 할 수 있습니다. 역 인용 부호 (')는 인라인 코드를 표시하는 데 사용됩니다. 또한 질문에 대한 답변이있는 경우 다른 사람들이 질문이 해결되었음을 알 수 있도록 대답을 "수락 됨"으로 표시하십시오. –

정상적인 동작입니다. CSS의 공간은 구분 기호입니다. 이 경우 li 자손을 선택합니다.

출처

2012-01-07 15:39:56 Krzysztof

리 : 호버 초보자의 발언

답변

관련 문제