포스트의 첫번째 이미지를 타이틀보다 상단에 위치하게

첨부된 스크린샷처럼 .article 안에 처음 나오는 이미지를 titlewrap 안에 위치하게, 타이틀보다 위에 위치하게 하고 싶습니다. 자바스크립트는 모르고 제이쿼리 혀끝만 대본 상태라 단순하게 .attr이나 appendTo로 :first 해서 하면 될 줄 알았는데 안 되더라고요..ㅋ;;; 힌트라도 좀 부탁드립니다. ^^;;;

만일 이미지의 세로 크기가 항상 같은 값이라면 이렇게 하면 됩니다.

마크업은 아래와 같이 하시고

<section>

  <h1>제목 부분</h1>

  <article>내용부분</article>

</section>

CSS 아래처럼 적용하시고 (이미지 세로 사이즈 350px로 가정)

section {position:relative; padding-top:350px;}

article .img_first {position:absolute; top:0; left:0;}

글을 작성하실 때 

맨 위에 오게 하고 싶은 이미지에 "img_first"라는 클래스를 적용하시면 됩니다.

<img src="경로" class="img_first" alt="이미지설명" />      

이렇게 하시거나

<div class="img_first">이미지코드</div>

 이렇게 하시면 됩니다.