1
현재 웹 사이트에서 작업 중이며 페이지 바닥에 머물러 있지 않은이 꼬리말에 미쳐 있습니다. 이미 동일한 문제로 다른 주제를 확인했지만 해결할 수있는 것은 없습니다.페이지 하단에 바닥 글을 설정할 수 없습니다.
"상대"를 시도하면 바닥 글이 "내 머리글"인 "톱 박스"아래로 이동하고 "절대"를 시도하면 페이지 중간에 이동합니다.
<header>
<div class="topbox">
<ul>
<li><a class="active" href="#home">Home</a></li>
<li><a href="#news">Services</a></li>
<li><a href="#contact">Clients</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#about">About</a></li>
</ul>
</div>
</header>
<body>
<div class="wrapper">
<div class="scrollbtn"><img src="Images/Scroll.png" style="width:40%"/>
</div>
<div class="bgbox">
<div class="box2">
<a> Lorem ipsum dolor sit amet, consectetur adipiscing elit...
</a>
</div>
</div>
<div id="footer">© 2017 "TEXT" All Rights Reserved</div>
</div>
</body>
그래서 여기에 우리는 헤더, 래퍼, scrollbtn (스크롤해야 할 나타내는 마우스의 그림), bgbox (내용의 배경), BOX2 (내용)은 "lorep ipsum의입니다 TOPBOX이 "내용은 매우 길기 때문에 사용자가 스크롤 할 수 있습니다. 그것은 내 문제입니다. 바닥 글은 페이지를로드 할 때 페이지의 맨 아래에 있으므로 아래로 스크롤 할 때 페이지 중간에 있습니다. 여기
는 CSS입니다 : 내가 너무 많은 다른 것들을 시도했습니다body, html {
width:100%;
height:100%;
background-color: #060b0f;
padding:0%;
background-image: url('../images/background3.jpg');
background-size:cover;
background-repeat: no-repeat;
background-attachment: fixed;
}
/* HEADER */
.topbox {
margin:0%;
position: fixed;
top:0%;
left: 0%;
width:100%;
z-index:999;
text-align:center;
overflow: hidden;
padding:0%;
font-family:Impact;
font-size:20px;
}
.topbox ul {
list-style-type: none;
margin: 0%;
padding: 0%;
overflow: hidden;
background-color: #459cfe;}
.topbox li {
display: inline;
}
.topbox li a {
display: inline;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
.topbox li a:hover:not(.active) {
background-color: #397fcd;
}
.active {
background-color: #fff;
}
/*HEADER FIN*/
.scrollbtn {
position: absolute;
bottom : 0%;
left: 49%;
}
.hot {
color:#4080e1;
}
.box2 {
margin-top:0px;
margin-left:10%;
width : 70%;
opacity:1;
color: black;
overflow: hidden;
text-align:center;
z-index:4;
background-color:transparent;
}
.box2 a{
opacity:1;
}
.bgbox {
margin-top:0px;
margin-left:8%;
padding: 5%;
padding-left: 8%;
width : 70%;
position: absolute;
top : 10%;
left: 0%;
background-color: rgba(255,255,255,0.5);
overflow: hidden;
text-align:center;
z-index:3;
}
.bgbox:hover {
background-color: rgba(255,255,255,0.9);
}
#footer {
font-size:20px;
cursor:pointer;
color: black;
text-align: center;
width:100%;
position:relative;
left:0px;
bottom:0px;
background-color: #459cfe;
}
.wrapper {
height:100%;
}
(몸 높이를 변경하는 모든 포장을, 상대, 절대, 고정, 정적, ...) 나는 생각하지 수 다른 것의. 나는 외부 관점을 필요로한다. 이 올바른 HTML 코드는 모든 코드 출력되지 올바른 방법의
'topbox'는 body 태그 안에 있어야합니다. 이 문제는 수정 사항이라고 말하지 않고 문제를 지적하거나 오타입니다 –
아니 오타가 아니지만 문제가되지 않았어 고맙습니다. –