类似于框架或固定下拉菜单的 CSS 页面内的滚动窗口答案

【问题标题】：scrolling window within a css page similar to frames or fixed drop down menu类似于框架或固定下拉菜单的 CSS 页面内的滚动窗口
【发布时间】：2013-12-24 14:27:25
【问题描述】：

我不太确定如何解释它，但我一直在到处寻找，但无济于事。请在这里帮助我。我在大学里学过 CSS，但有点生疏。我想拥有我的古生物学网站，以便在左侧有恐龙名称作为可滚动选项。我的旧版本网站是 html，它在框架中。人们喜欢这些框架，因为当他们搜索恐龙名称时，主页没有受到影响。在新的 CSS 中，整个页面移动。此外，当我将一只或 3 只恐龙添加到列表中时，我不想将它单独添加到超过 30 页的恐龙中。我想编辑一个页面并让它影响所有页面。

我为恐龙创建了一个独立的页面 -> dino_list.php 但实施它我不知道该怎么做。我猜这里有一个“包含”代码？

你能帮帮我吗？

这是网址：http://DinosauriaOnline.com

谢谢，文斯

【问题讨论】：

标签： php html css encoding web

【解决方案1】：

我想拥有我的古生物学网站，以便拥有恐龙左侧的名称作为可滚动选项。

要使您的恐龙列表可滚动，请为其指定一个 ID，例如 #dino-list，然后使用 CSS 为其指定一个固定高度。然后在你的 CSS 中设置overflow: scroll。这会缩小列表，截断一些内容，然后告诉浏览器它应该有一个滚动条来访问截断的内容。

#dino-list {
    overflow-y: scroll;
    height:200px;
}

产生这个：

添加固定高度非常重要 - 否则浏览器会假定您无论如何都想显示整个列表，并且有一个滚动条。

我已经为恐龙创建了一个独立的页面 -> dino_list.php 但是我不知道该怎么做。我猜有一个“包含”代码？

是的。

include "dino-list.php";

把它放在你想要列表的地方。它的作用是获取dino-list.php 并将内容转储到您放置该行的任何位置。因此，如果您在dino-list.php 中有您的 HTML 列表，那么无论您将 include "dino-list.php"; 放在哪里，它都会被放入主代码中。

所以，dino-list.php 可能看起来像这样：

<ul id="dino-list">
    <li><a href="Acrocanthosaurus.html">Acrocanthosaurus</a></li>
    <li><a href="Velociraptor.html">Velociraptor</a></li>
</ul>

index.php 可能看起来像这样：

<div id="sidebar">
    <h2>Dinosaurs</h2>
    <div class="sidemenu">
        <?php include "dino-list.php"; ?>
    </div>
    <h2>Cretacious Non Dinosaurs</h2>
    <!-- rest of sidebar here -->
</div>

关于include 的一件事——它确实获取了源文件中的所有内容，并将其转储到您的代码中。如果您在 dino-list.php 中包含 PHP 代码，它将在您的主文件中运行。

【讨论】：