[기타] 답변입니다.

1. 원래 스크립트

<div>

   <div data-inven-id="base12" style="width:450px;height:526px;background:url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i14746204640.png)">

      <div data-inven-id="cube1" style="width:100%;height:100%;background:url('https://upload2.inven.co.kr/upload/2017/11/19/bbs/i13393834840.png')">

         <div data-inven-id="haikei2" style="width:100%;height:100%;background:url('https://upload2.inven.co.kr/upload/2017/11/19/bbs/i16608183145.png');"></div>

         <div style="width: 60px; height:18px; margin:5px; float: left; background-color: yellow; border-radius: 5px;text-align:center;" 

         data-inven-click-css="{'cube1':[{'background':'none'},{'background':'url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i13393834840.png)'}]}">

            <span style="font-weight:bold;">큐브</span>

         </div>

         <div style="width: 60px; height:18px; margin:5px; float: left; background-color: yellow; border-radius: 5px;text-align:center;" 

         data-inven-click-css="{'haikei2':[{'background':'none'},{'background':'url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i16608183145.png)'}]}">

            <span style="font-weight:bold;">배경</span>

         </div>

         <div style="width: 60px; height:18px; margin:5px; float: left; background-color: lightblue; border-radius: 5px;text-align:center;" 

         data-inven-click-css="{'cube1':{'background':'url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i13393834840.png)'},

                              'haikei2':{'background':'url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i16608183145.png)'}}">

         <span style="font-weight:bold;">초기화</span>

         </div>

      </div>

   </div>

</div>

큐브

배경

초기화

 

2. 수정된 스크립트

<div>

   <div data-inven-id="base12" style="width:450px;height:526px;background:url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i14746204640.png);">

      <div data-inven-id="cube1" style="width:100%;height:100%;background:url('https://upload2.inven.co.kr/upload/2017/11/19/bbs/i13393834840.png') center / 100% no-repeat;">

         <div data-inven-id="haikei2" style="width:100%;height:100%;background:url('https://upload2.inven.co.kr/upload/2017/11/19/bbs/i16608183145.png');"></div>

         <div style="width: 60px; height:18px; margin:5px; float: left; background-color: yellow; border-radius: 5px;text-align:center;" 

         data-inven-click-css="{'cube1':[{'background':'none'},{'background':'url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i13393834840.png) center / 100% no-repeat'}]}">

            <span style="font-weight:bold;">큐브</span>

         </div>

         <div style="width: 60px; height:18px; margin:5px; float: left; background-color: yellow; border-radius: 5px;text-align:center;" 

         data-inven-click-css="{'haikei2':[{'background':'none'},{'background':'url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i16608183145.png)'}]}">

            <span style="font-weight:bold;">배경</span>

         </div>

         <div style="width: 60px; height:18px; margin:5px; float: left; background-color: lightblue; border-radius: 5px;text-align:center;" 

         data-inven-click-css="{'cube1':{'background':'url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i13393834840.png) center / 100% no-repeat'},

                              'haikei2':{'background':'url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i16608183145.png)'}}">

         <span style="font-weight:bold;">초기화</span>

         </div>

      </div>

   </div>

</div>

큐브

배경

초기화

 

3. 설명

1) style의 경우

background:url('https://upload2.inven.co.kr/upload/2017/11/19/bbs/i13393834840.png') center / 100% no-repeat;

2) css의 경우

'background':'url(https://upload2.inven.co.kr/upload/2017/11/19/bbs/i13393834840.png) center / 100% no-repeat'

이미지 url 괄호 닫은 뒤쪽에 center / 100% no-repeat을 추가해주세요.

center는 중앙 정렬, 100%는 가로,세로 사이즈 비율, no-repeat은 이미지가 반복 출력되지 않는 것을 의미합니다. 

+

center / 100% 90% 의 경우 가로 100%, 세로 90%를 의미합니다.

++

사이즈 단위의 경우 마찬가지로 center / 450px 526px no-repeat 이렇게 절댓값도 가능합니다.