造型分页链接

时间:2010-08-13 19:47:10

标签: php html css

下面的分页代码工作得很好。但是,我遇到了CSS的问题。当用户在第1页上时,分页链接的位置实际上只显示我想要的位置。这是距离浏览器顶部2800像素。

对于第2页到第n页,我正在分页的HTML表底部和分页链接之间有大约100个额外像素的空间。 (I. E.链接距离浏览器顶部大约2900像素。)

在第n页(最后一页)上,分页链接显示距浏览器顶部约5600像素。这会在我正在分页的HTML表格底部和链接本身之间添加大量空白。

无论用户在哪个页面,我都知道如何从浏览器顶部创建2800像素的链接?

提前致谢,

约翰

分页代码:

if ($currentpage > 1) {   
   echo " <div class='pages'><a href='http://www...com/phoenix/index.php?currentpage=1' class='links'><<</a></div> ";  
   $prevpage = $currentpage - 1;  
   echo " <div class='pages'><a href='http://www...com/phoenix/index.php?currentpage=$prevpage' class='links'><</a></div> ";  
} 
for ($x = ($currentpage - $range); $x < (($currentpage + $range) + 1); $x++) {  
   if (($x > 0) && ($x <= $totalpages)) {  
      if ($x == $currentpage) {  
         echo " <div class='pages'>[<b>$x</b>] </div>";  
      } else {  
     echo " <div class='pages'><a href='http://www...com/phoenix/index.php?currentpage=$x' class='links'>$x</a></div> ";  
      } 
   } 
}  
if ($currentpage != $totalpages) {   
   $nextpage = $currentpage + 1;  
   echo " <div class='pages'><a href='http://www...com/phoenix/index.php?currentpage=$nextpage' class='links'>></a></div> ";  
   echo " <div class='pages'><a href='http://www...com/phoenix/index.php?currentpage=$totalpages' class='links'>>></a></div> ";  
} 

CSS:

.pages
    {
    color: #000000;
    overflow: hidden;
    display: block;
    float: left;
    margin: 4px;
    margin-top: 2800px;
    margin-bottom:0px;
    margin-left: 10px;
    padding-bottom: 0px;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 24px;
    }       


 a.links:link {
    color: #004284; text-decoration: none;
    text-align:center;
    margin-left:8px;
    margin-bottom:0px;
    padding:2px;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 24px;
    }

 a.links:visited {
    color: #004284; text-decoration: none;
    text-align:center;
    margin-left:8px;
    margin-bottom:0px;
    padding:2px;
    font-family:Georgia, "Times New Roman", Times, serif;
    font-size: 24px;
    }

 a.links:active {
    color: #004284; text-decoration: none; 
    text-align:center;
    margin-left:8px;
    margin-bottom:0px;
    padding:2px;
    font-family:Georgia, "Times New Roman", Times, serif;
    font-size: 24px;
    }

 a.links:hover {
    color: #FFFFFF; text-decoration: none; 
    background-color: #004284;
    text-align:center;
    margin-left:8px;
    margin-bottom:0px;
    padding:2px;
    font-family:Georgia, "Times New Roman", Times, serif;
    font-size: 24px;
    }   

1 个答案:

答案 0 :(得分:0)

如果我读得正确,听起来你想要定位:绝对,顶部:2800px on .pages。

然而,将它们定位得很低,这听起来并不是一个很好的设计决定。如果页面短于2800px,您可能会丢失链接。

相关问题