Question

以下HTML代码工作正常，但我无法滚动页面，显示的滚动条未激活。这里需要定位以分隔页面，所以请帮我解决问题。

 <html lang="en">
<head>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <style>

body
{ 
margin: 0%;
padding: 0%;
}
.container 
{ 


   width: 100%;
   height: 100%;
   }
#left
{
float: left;
 position: fixed;
     top: 0%;
    left: 0%;
    width: 50%;
    height: 100%;


 }
 #right
{
 position: fixed;

     top: 0%;
    right: 0%;
    width: 50%;
    height: 100%;
    background-color: #59595c; 


 }

 #centrd {

  padding-top: 40%;


}
#centd {

  padding-top: 40%;


}    

.pos_fixed {
    position: fixed;
    top: 3.5%;
    right: 2.5%;
   display: inline-block;
}  




</style>

</head>



    <body>

<div class="container">
<div class="row" >
<div class="col-md-6" style="padding-top:500px;">
<div id="left" align="center">
<div id="centd">
        <img src="http://localhost/wordpress/wp-content/uploads/2014/10/ramc-Untitled-1.png" alt="Smiley face" width="150" height="150">
        </div>


<a href="http://localhost/wordpress/album-categories/wedding/"><img src="http://localhost/wordpress/wp-content/uploads/2014/10/Studio-A-travel1.png" alt="list item 1" width="150" / ></a>
<a href="http://localhost/wordpress/album-categories/wedding/"><img src="http://localhost/wordpress/wp-content/uploads/2014/10/Knowledge-icon2.png" alt="list item 2" width="150" /></a>

 </div>
 </div>









<div class="col-md-6"  style="padding-top:500px;">
<div id="right" align="center">
       <div id="centrd">
        <img src="http://localhost/wordpress/wp-content/uploads/2014/10/studioa-a1.png" alt="Smiley face" width="150" height="150">
         </div>
        <a href="http://localhost/wordpress/album-categories/wedding/"><IMG src="http://localhost/wordpress/wp-content/uploads/2014/10/Studio-A-WED.png" alt="list item 1" width="150" /></a>
      <a href="http://localhost/wordpress/album-categories/wedding/"><IMG src="http://localhost/wordpress/wp-content/uploads/2014/10/Studio-A-Cam.png" alt="list item 2" width="150" /></a>


</div>
</div>

 <div class="pos_fixed">
        <a href="http://www.amarramesh.com/contact/"><img src="http://localhost/wordpress/wp-content/uploads/2014/10/get-in-touch.png" alt="Smiley face" width="100" height="100">
        </div>
</div>


</div>
 </div>





</body>

Answer 1

{position：fixed;}将不会滚动：您正在阻止对象（假设为div）到窗口的特定部分。它会留在那里。

位置固定的滚动条问题

1 个答案: