HTML 이미지 위치 고정

쇼핑몰이나 어떤 사이트에서 화면에 항상 떠있는 이미지를 본 일이 있을 것이다.

스크롤을 내리거나 올려도 항상 그 위치로 따라다니는 내 티스토리에 나오는 광고 같은 거 말이다.

어떻게 그렇게 되는 걸까?

방법은 div 태그를 이용하는 것이다.

div 태그의 style 속성에서 position을 fixed로 해주면 된다.

다음과 같이 코딩하면 "이미지파일"은 웹페이지의 오른쪽 맨아래에 고정되어 보인다.

<div style="position:fixed;right:10px;bottom:10px;">

<img src="이미지파일"/>

</div>