HTML 맨 위로 이동하기

넷 상의 글을 읽다가 맨 위로 올라가고 싶을 때가 있다.

요즘은 대부분의 사이트에 있는 기능으로

이 전 포스트인 <a> 태그와 태그 스타일 속성의 poisiton:fixed;를 활용하면 충분히 만들 수 있다.

여기서 추가되는 속성은 <a> 태그의 display:scroll 뿐이다.

코드는 다음과 같다.

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

<a style="display:scroll" href="#">

<img src="./images/up.png" />

</a>

</div>

스타일 속성은 <div> 태그에서 줄 수도 있고 <a>태그에서도 줄 수 있으므로

간단히 작성할 때 다음과 같이 쓸 수 있다.

<a style="position:fixed;right:10px;bottom:10px;display:scroll" href="#">

<img src="./images/up.png" />

</a>