2013-04-05 3 views
6

여러 페이지에 <section> 태그를 사용하고 있지만 한 페이지에 태그 앞에 <section> 태그가 사용되었습니다.특정 요소가 옆에있는 경우에만 요소에 스타일 적용

<aside> 다음에 바로 <section>이 오는 경우 두 가지 모두에 너비를 적용하고 섹션을 왼쪽으로두고 오른쪽을 오른쪽으로 띄우고 싶습니다.

section { 
    width: 500px; 
    float: left; 
    padding: 8px; 
} 

aside { 
    padding:8px; 
    width:400px; 
    float:right; 
} 

난 단지 내가이 일 할 <section>이있는 경우처럼 :

section { 
    padding: 8px; 
} 

인가 내가 가지고있는 경우

기본적으로, <section><aside> 나는 스타일이 이런 식으로 작업 할 거기 CSS3, 또는 가상 클래스, 자바 스크립트, 사용자 정의 클래스 또는 별도의 CSS 파일을 사용하지 않고도 조건문을이 할 수있는 방법은? 당신이 aside ~ section 또는 aside + section 사용할 수있는 경우

<aside>content</aside> 
<!-- if there is another node in between, use the '~' selector --> 
<section>content</section> 

: 다른 모든 경우에

section { 
    padding: 8px; 
} 
aside + section { 
    width: 500px; 
    float: left; 
} 

당신이 자바 스크립트를 사용해야 할거야 <section/><aside/> 다음에 오는 경우

답변

11

에만 작동 이러한 선택기는 위에서 아래로 한 방향으로 만 작동하기 때문입니다.

CSS4를 사용하면 Subject of a selector with Child combinator을 사용하는 방법이있을 수 있지만 그 미래는 있습니다.이 선택기가 사양에서 제거되었습니다.

관련 문제