웹 페이지에서 하단 오른쪽에 고정된 위치에 있는 이미지 클릭시 이동
아래 코드는 특정 웹 페이지에서 사용되는 HTML 코드입니다. 이 코드는 사용자가 웹 페이지에서 하단 오른쪽에 고정된 위치에 있는 이미지를 클릭하면 지정된 링크로 이동하게 됩니다.
<!-- 이동 Start --> <a style="display: scroll; position: fixed; bottom: 200px; right: 00px;" href="#" > <img src="./images/poll.png" border="0" width="100" height="70"/> </a> <!-- 이동 END -->
해당 코드는 이동 링크를 나타내는 HTML 코드입니다. 아래는 코드의 해석입니다:
- <a> 태그: 하이퍼링크를 정의하는 태그입니다.
- style 속성: 링크의 스타일을 정의합니다.
- display: scroll: 스크롤이 가능하도록 설정합니다.
- position: fixed: 화면에 고정된 위치에 표시됩니다.
- bottom: 200px: 하단에서 200픽셀 떨어진 위치에 표시됩니다.
- right: 00px;: 오른쪽에서 0픽셀 떨어진 위치에 표시됩니다.
- href="#": 클릭 시 이동할 링크를 현재 페이지로 설정합니다. 즉, 현재 페이지를 새로고침하는 효과를 줍니다.
- style 속성: 링크의 스타일을 정의합니다.
- <img> 태그: 이미지를 표시하는 태그입니다.
- src: 이미지 파일의 경로를 지정합니다.
- border="0": 이미지 주변에 테두리를 없앱니다.
- width="100" height="70": 이미지의 가로 폭과 세로 높이를 지정합니다.
이 코드는 사용자가 이미지를 클릭하면 현재 페이지를 다시 로드하는 효과를 가지고 있습니다.
반응형
'정보저장소' 카테고리의 다른 글
치지직 누구나 시청가능, 시청방법 및 스트리머 활동 안내 (0) | 2023.12.20 |
---|---|
티빙 12월 라인업 [마에스트라, 환승연애2, 이재 곧 죽습니다.] (1) | 2023.12.18 |
페이지 하단 고정된 위치에 "top"으로 이동하는 html코드 (0) | 2023.12.17 |
티스토리 본문 글 사이드에 고정 링크 넣기 (0) | 2023.12.17 |
앱스토어 폭로! '인앱결제 강제' 파문의 시작 (0) | 2023.12.15 |
댓글