CSS를 사용하여 이미지 위에 텍스트 배치

Question

"여기"이미지 위에 텍스트를 삽입하는 방법은 무엇입니까?
포장에서 20px 오른쪽으로 250px로 고정되어야합니다.

HTML

<div class="background-image"> 
    <img src="img/picture.jpg" alt="pasta-town"> 
    <div id="motto" class="wrap"> 
     <div>some motto</div> 
    </div> 
</div> 

CSS

#motto { 
font-size: 26px; 
font-family: "MetaProMedium"; 
position: absolute; 
top:0; 
} 
#motto div { 
left: 755px; 
width: 250px; 
} 
.background-image { 
position: relative; 
width: 100%; 
} 
.background-image > img { 
width: 100%; 
} 

Answer 1

당신은 이미지가 포함 된 div 당신이 높은 Z를 포지 할 텍스트 모두에 대해 Z- 인덱스를 조정해야합니다 -index가 하위 항목에 겹쳐집니다.