Текст заголовка над изображением

Question

Я хочу, чтобы текст заголовка (Events, Blog, About) отображался в верхней части изображения «Images/Damask.png». Вместо этого изображение отображается в самой верхней части заголовка с текстом НИЖЕ изображения.

<header> 

    <header> 
    <img src="Images/Damask.png" width="100%" border="0" height="200" class="header"> 
     <a href="index.html" id= "logo">![enter image description here][1] 
      <h1>J Barnes Events</h1> 
      <h2>Indianapolis's Finest<h2> 
     </a> 
     <nav> 
      <ul> 
       <li><a href="index.html" class="selected">Events</a></li> 
       <li><a href="about.html">Blog</a></li> 
       <li><a href="contact.html">About</a></li> 
      </ul> 
     </nav> 
</header> 

Answer 1

Вместо отдельного добавления изображения, вы можете просто добавить следующее CSS в таблице стилей и достичь бы, что вы пытаетесь сделать:

header { 
    background-image: url('Images/Damask.png'); 
}