[CSS Quiz] CSS를 이용해 아군을 구출하라!

출처 : 정찬명님 블로그 (http://naradesign.net/wp/2014/08/01/2057/)

상황 설명

  • <ol>은 적의 진영이기 때문에 함부로 침범하거나 수정할 수 없습니다.
  • <li>는 적군 병사이거나 또는 적군에게 잡혀간 아군 병사들 입니다.
  • 1과 9는 적의 문지기 병사이고, 짝수인 2, 4, 6, 8 역시 적군 병사입니다.
  • 밑줄 친 숫자(1보다 크고 9보다 작은 홀수)가 적진에 잡혀간 아군 병사입니다.
<style>/* 아군 진지: 작전은 이곳에 */</style>
 <!– 적군 진지: 수정할 수 없음 –>
 <ol>
 <li>1(적군: 문지기)</li>
 <li>2(적군)</li>
<li>3(아군)</li>
 <li>4(적군)</li>
<li>5(아군)</li>
 <li>6(적군)</li>
<li>7(아군)</li>
 <li>8(적군)</li>
 <li>9(적군: 문지기)</li>
 </ol>
 <!– 적군 진지: 수정할 수 없음 –>

미션 설명

최근에 전문가를 위한 CSS3를 공부하는 중에 이 문제를 만난 덕분에 쉽게 풀었습니다.

See the Pen yNPxGe by In Suk Kim (@shoo7830) on CodePen.


Originally published at webholic.net.

Show your support

Clapping shows how much you appreciated Aria Kim’s story.