배경 이미지 내에 텍스트 배치

Question

배경 이미지가 포함 된 div 내에 텍스트를 배치하려고합니다. 어떻게하면이 일을 진행할 수 있습니까? 사이트는 반응 적이어야합니다. 이 사이트의 올바른 섹션과 같은 것입니다. http://loveandluxesf.com/

그래서 다음과 같은 코드가 있습니다.

<div class="row"> 
    <div class="six columns" id="signup-section"> 
     <div id="bg-img"> 
     <div class="offset-by-two"> 
     <h2>Random text which should go in here</h2> 
      <form> 
      <input type="email"> 
      <span class="button">Register</span> 
      </form> 
     </div> 
     </div> 
    </div> 

bg-img는 가운데에 배치 된 배경 이미지를 포함합니다. 텍스트와 양식을 이미지 안에 정확히 넣고 싶습니다. 여러 해상도에서 작동합니다.

Answer 1

포함 된 div의 위치를 ​​상대적으로 지정하면 텍스트 요소 (h1)를 절대적으로 배치하면 왼쪽 위 오른쪽 정렬을 사용하여 포함 된 div와 관련하여 원하는 곳에 텍스트를 배치 할 수 있습니다. 더 자세한 내용이 필요하면 그냥 물어보십시오.

Answer 2

는 style="float:left;"