상단에 일시정지 새로고침하는 것은 어떻게 나오게 하나요??
589
投稿した質問数 14
html에
상단에 일시정지 새로고침 아이콘들 나오게 하는것은 어떻게 하나요??
回答 1
0
안녕하세요, 인프런 AI 인턴이에요.
HTML에서 상단에 일시정지 새로고침 아이콘을 나타내기 위해선, 일단 아이콘 이미지 파일을 준비해야 합니다. 그리고 해당 이미지를 HTML 코드에서 적절히 사용하여 표시하면 됩니다.
예를 들면, 다음과 같이 HTML 코드를 작성할 수 있습니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>일시정지 새로고침 아이콘</title>
<style>
/* 아이콘 이미지 파일을 배경으로 설정 */
.refresh-icon {
display: inline-block;
width: 20px; /* 이미지 크기에 맞게 조절 */
height: 20px; /* 이미지 크기에 맞게 조절 */
background: url('images/refresh.png') no-repeat; /* 이미지 파일 경로 */
background-size: contain; /* 이미지 크기에 맞게 조절 */
cursor: pointer; /* 커서를 포인터로 변경하여 클릭 가능하게 설정 */
}
</style>
</head>
<body>
<!-- 상단에 아이콘을 나타내는 div를 추가 -->
<div style="position: fixed; top: 0; right: 0;">
<span class="refresh-icon"></span>
</div>
</body>
</html>
위 코드에서는 클래스 이름이 ‘refresh-icon’인 span 태그에 아이콘 이미지를 배경으로 설정하여 나타내었습니다. 또한, 상단에 아이콘을 나타내기 위해 position 속성을 fixed로 설정하였고, top, right 속성을 이용하여 위치를 조절하였습니다.
이렇게 하면 해당 페이지의 상단에 일시정지 새로고침 아이콘을 나타낼 수 있습니다. 참고하시기 바랍니다.
더 자세한 내용이 필요하면 언제든지 댓글로 질문해주세요. 감사합니다!
용어 발음법이 계속 바뀌는 것 같은데 이런 부분들 개선이 가능할까요...?
0
7
1
counter01.html은 어디있을까요?
1
9
1
존재하지 않는 일기 url입력 시 alert이 두 번 떠요
0
28
1
useState 직접 구현 부분에서 질문이 있습니다.
1
31
1
학습을 하고 블로그에 정리를 해도 괜찮을까요?
1
34
1
교재(3쇄)와 강의 내용 문의
0
33
2
섹션2번 부분 강의 화면이 잘 못된것 같아서 문의합니다.
0
23
1
call stack 표현이 잘못표현된것이 아닌가요?
0
73
2
React 와 Virtual DOM 의 이야기 영상 실행이 안됩니다.
0
35
1
일반 강의와 차이점?
1
53
1
!= 연산자의 역할
0
35
1
중요하진 않지만 설명하신부분에서 안된부분..
1
37
1
강의 듣는 순서가 어떻게 되나요?
0
51
1
stopPropagation()에 대해서 질문 있습니다.
0
50
2
12.13) 하단 여백 스타일링 관련 질문 드립니다.
0
66
2
27강 Context내 RSC 사용 관련 문의
0
85
3
10:51 list와 num에 대한 출력 코드가 둘 다 있는데 왜 num만 출력되는지 ?
0
369
0
변수 선언 시 undefined
0
502
1
파라미터랑 아규먼트가 같은건가요?
0
357
0
강의 중에 scrip에 관해 질문드립니다.
0
408
2
자바스크립트 코드 실행
0
311
0
노드 버전 질문
0
385
1
왜 결과값이 안나오는지 알수 있을까요? let대신 var를 써도 안나오네요ㅜㅜ
0
721
3
할인을 메긴 결과값이 나오지를 않습니다. 코드 한번 봐주시길 부탁드립니다 ㅜㅜ
0
478
1