부트스트랩 설정 페이지에서 상단 호버 프롬프트로 돌아가는 방법은 다음과 같습니다.
1. 먼저 본문에 "맨 위로 돌아가기" 버튼을 추가하세요
<body> <div class="go-top"> <div class="arrow"></div> <div class="stick"></div> </div> </body>
2. 버튼이 항상 오른쪽 하단에 표시되도록 위치를 고정했습니다. left:90%를 설정하면 버튼이 스크롤 막대에 너무 가깝지 않고 오른쪽에 표시될 수 있습니다.
3. 페이지가 특정 높이로 스크롤되면 버튼이 기본적으로 표시되지 않습니다.
div .go-top {
display: none;
opacity: 0.6;
z-index: 999999;
position: fixed;
bottom: 113px;
left: 90%;
margin-left: 40px;
border: 1px solid #a38a54;
width: 38px;
height: 38px;
background-color: #eddec2;
border-radius: 3px;
cursor: pointer;
}
div .go-top:hover {
opacity: 1;
filter: alpha(opacity=100);
}
div .go-top div .arrow {
position: absolute;
left: 10px;
top: -1px;
width: 0;
height: 0;
border: 9px solid transparent;
border-bottom-color: #cc3333;
}
div .go-top div .stick {
position: absolute;
left: 15px;
top: 15px;
width: 8px;
height: 14px;
display: block;
background-color: #cc3333;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}권장:
부트스트랩 소개 튜토리얼위 내용은 부트스트랩에서 페이지를 상단 호버 프롬프트로 다시 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
