4

我有一个带有以下源代码（“likes.php”）的弹出窗口：

<!DOCTYPE html>
<html>
<head>
    <title>Like</title>
  <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
</head>
<body>
<ol>
    <?php for($i=0;$i<500;$i++){ ?>
    <li><p><?php echo $i ?></p></li>
    <?php } ?>
</ol>
</body>
</html>

现在的问题是，虽然所有的段落都创建了，但我看不到它们，因为没有滚动条。如何将滚动条附加到我的页面？

链接到打印屏幕

它在 chrome 上工作，但不是在 firefox 中，如果它出现在弹出窗口中（其他文件调用 window.open（“likes.php”）。在常规窗口中的两种浏览器中都可以使用。

4

2 回答 2

4

使用 cssoverflow属性。将此添加到您的<head>标签中：

<style type="text/css">
  body, html {
    margin: 0;
    padding: 0;
    height: 100%;
  } 
  .scroller {
    overflow: scroll;
    padding: 5px;
    height: 100%;
  }
</style>

要专门添加水平或垂直滚动​​条，请分别使用overflow-x或overflow-y。

您还需要修复<li>元素的关闭标记，并将其包装在适当的容器中，如下所示

<div class="scroller">
  <ul>
    <?php for($i=0;$i<500;$i++)
              echo "<li>".$i."</li>";
    ?>
  </ul>
</div>
于 2013-03-14T23:32:31.607 回答
1

要控制溢出，一般需要使用 CSS 的溢出属性

overflow: scroll

正如 pswg 所说，但您永远不需要像他建议的那样将其应用于整个身体。如果您的代码格式正确，浏览器应自行将滚动条添加到整个页面。

当前问题可能是由于您没有关闭第二个<li>标签和 PHP 格式不正确引起的。您不需要在每行的末尾休息。线条没有中断的原因是您没有将<li>元素包含在<ol>or<ul>中。此外，将 if 语句的开头、填充符和结尾放在单独的 php 标记中只会使计算机感到困惑。而是使用：

  <?php 
    echo "<ul>";
    for( $i=0; $i<500; $i++) { 
      echo "<li>" .  $i . "</li>";
    } 
    echo "</ul>";
  ?>
于 2013-03-14T23:38:16.090 回答