<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;"><span style="color: #9cdcfe;">background</span>&nbsp;:&nbsp;<span style="color: #dcdcaa;">url</span>(<span style="color: #9cdcfe;">../img/sp_com.png</span>)&nbsp;<strong><span style="color: #ce9178;">no-repeat -150px 0</span>;</strong></div>
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;"></div>
<div style="color: #d4d4d4; background-color: #1e1e1e; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">
<div style="line-height: 19px;"><strong><span style="color: #9cdcfe;">background-position</span></strong></div>
<div style="line-height: 19px;"><span style="color: #9cdcfe;"></span></div>
<div style="line-height: 19px;"><span style="color: #9cdcfe;">Bold 문구 두가지의 차이가 무엇인가요?</span></div>
<div style="line-height: 19px;"><span style="color: #9cdcfe;"></span></div>
<div style="line-height: 19px;"><span style="color: #9cdcfe;">축약형태인가요?</span></div>
<div style="line-height: 19px;"><span style="color: #9cdcfe;"></span></div>
<div style="line-height: 19px;"><span style="color: #9cdcfe;">아니면 사용하는 시점이(용도) 다른가요?</span></div>
<div style="line-height: 19px;"><span style="color: #9cdcfe;"></span></div>
</div>

<p><img src="https://cdn.inflearn.com/public/comments/dd3c3976-c3c5-4c65-bf11-f59a6e69f240/캡처.PNG" title="캡처.PNG" width="717" height="648" alt="" /></p>
<p>background라고 구글에 올려보면 background를 변경할 수 있는 요소들이 굉장히 많이 나옵니다.</p>
<p>background-image, background-size, background-position 이렇게 일일이 처서 변경이 가능하지만 귀찮지 않습니까?</p>
<p>그래서 a{background:url() 150px #fff; 뭐} 이런식으로 - 뒤에 나오는 언어를 생략하고 background만 쓰고 뒤에 들어갈 숫자만 써주는거입니다.</p>

Inflearn Community Q&A

이미지 사용시 좌표 질물