[TIL] 이미지에 링크 걸기, 화면 맨위로 올리기 23.6.1

행복한 딸기🍓·2023년 6월 1일
0

TIL

목록 보기
6/7

github 이미지에 링크 걸기

<a href="https://github.com/leesoojinn" target="_blank">
          <img
            class="github-img"
            src="https://cdn-icons-png.flaticon.com/512/25/25231.png"
          />
</a>

<a> 태그 안에 <img> 태그를 넣는다.
<a> 태그 안에 href 안에 내가 들어가고 싶은 주소를 넣는다.
<img> 태그 안에 src에는 이미지 png 주소를 넣는다.

결과


화면 맨위로 올리기 효과

        <a href="#">
          <img
            class="arrow-img"
            src="https://cdn-icons-png.flaticon.com/128/4196/4196777.png"
          />
        </a>

<a> 태그 안에 href="#" 을 넣어준다.
<img> 태그 안에 src 에 마찬가지로 png 주소를 넣어준다.

href="#"는 빈 링크로 이동을 한다.
링크를 클릭하면 기본적으로 해당 URL로 이동하려는 브라우저의 동작에 의해 페이지가 맨위로 스크롤되는 것이다.

결과

profile
🍀먹고 자라는 새싹🌱

0개의 댓글