css 이미지를 background-position-x,y로 위치잡아서 표현하는 방법

위와같이 숫자를 이미지로 표현할때 붙어있는 한장의 이미지에서 표현하는 방법:
1. css에 전체를 나타내는 포지션을 먼저 잡고 background: url(./img/list.png)no-repeat; 해준다.
2. html에서 각각의 번호마다 span태그의 이름을 choice1,2,3,4,5 만들어 놓은 태그에 css로 background-position-x를 잡는다.

ex)
#quiz-content>#quiz-choice>.choice2>.choice-num{background-position-x: -28px;}
#quiz-content>#quiz-choice>.choice3>.choice-num{background-position-x: -56px;}
#quiz-content>#quiz-choice>.choice4>.choice-num{background-position-x: -84px;}
#quiz-content>#quiz-choice>.choice5>.choice-num{background-position-x: -112px;}