💅Decorate from CSS : 다양한 선택자들 #12

*해당 포스팅은 CSS Diner 게임을 통해 다양한 선택자들을 연습하는 게임이다. 강의에서도 해당 게임을 해설해주니 한번 풀어보길 권장한다.

13번 문제가 잘 풀리지 않았는다. 코드는 아래와 같다. 

 

  <div class="table">

    <bento>

      <apple class="small" />

    </bento>

    <plate />

    <apple class="small" />

    <plate />

    <apple />

    <apple class="small" />

    <apple class="small" />

  </div>

 

문제는 <apple class="small" />과 <apple />을 삭제 해야한다. 문제는 '+'를 사용해서 형제관계(Sibling)를 선택하는 것인데 이것은 인접한 선택자를 선택해서 문제를 해결하면되는 것이다. 즉, 우리가 선택해야하는 선택자들은 모드 plate를 사이에 두고 있다. 따라서 plate+apple이라고 작성하면 해당 apple들이 모두 사라진다.