PHP 包含和 CSS - 为包含的页面设置背景答案

【问题标题】：PHP includes and CSS - Set a background for an included pagePHP 包含和 CSS - 为包含的页面设置背景
【发布时间】：2013-03-09 22:31:52
【问题描述】：

我正在构建一个使用 PHP 包含页眉和页脚的网站。页脚的位置是动态的，基于页面的高度。所以有时页脚在我的浏览器中页面的 3/4 处，底部有一个很大的空白区域。我的页脚容器的背景是纯色 (#333)。

有没有办法设置这个并且只有这个页面有背景颜色？

我尝试在页脚页面上包含背景色 css 代码，但它适用于整个页面，而不仅仅是作为包含的一部分加载的页脚页面。

或者是否有一个 CSS 技巧来设置我的页脚容器 div 的高度等于页面加载时浏览器窗口的剩余高度？这可能是最好的方法...

我们将不胜感激！

【问题讨论】：

标签： php css include

【解决方案1】：

试试

index.php

<div style="backgroun-color:red;">
    <?php
        include('footer.php')
    ?>
</div>

footer.php

<p>Hello</p>

【讨论】：

不适合我。不过，这是个好主意。有道理。
@马特。你到底想要什么..??您还可以添加位置：固定以固定页脚区域...也可以添加高度等...您需要的。
我添加了 height:100% 但它什么也没做。我添加位置：固定；并且它将 div 移动到页面的左侧，尽管它确实将页脚的高度扩展到页面的其余部分（我将其居中）。当页面没有将页脚推过浏览器窗口底部时，希望有我的页脚页面/容器的背景来填写页面的其余部分。我的容器 div 有一个背景，但它显然只适用于我的 div 的高度。
@马特。如果您不介意可以为此创建小提琴...因为没有那很难看出出了什么问题。
什么是小提琴？对不起，我缺乏术语知识

【解决方案2】：

不，您必须使用 javascript 来制作具有动态高度的粘性页脚。 CSS 无法适应变化（媒体查询除外，但这很快就会变得混乱）。

Working Demo

所以基本上，您设置了传统的粘性页脚（使用推送）。然后将页脚的高度应用于推送，并作为换行的负下边距。

为了完成这项工作，必须将所提供结构之外的所有具有高度的元素添加到 jQuery 方程中。

最后，if (contentH < adjustedHeight) 使得如果内容已经将页面拉伸到超过屏幕的高度，它将不会触发。

编码愉快！

【讨论】：

非常感谢您花时间编写此代码！明天我会试一试，因为我现在使用它有点晚了。再次感谢您的编码，我会告诉您进展如何！
尝试尝试一下您的想法，但无法实现。做了一些更多的研究，实际上发现了这个：jsfiddle.net/fXf4K这只是对我的 CSS 的修改。也许我没有提供足够的信息让你完全理解我想要做什么。但是，再次感谢您的工作。使用它实际上让我对 JS 有了更多的了解。所以谢谢你！

【解决方案3】：

我做了一些研究，发现了我正在寻找的 CSS“技巧”。我基本上设置了一个错觉并修改了我的 CSS 以及它如何处理背景颜色样式。

http://jsfiddle.net/fXf4K/

<body>
    <section id="container">
    <header>This is your header</header>
    <section id="main">This is #main</section>
    <footer>This is your footer</footer>
    </section>
</body>

---------

body {background:#999;}
#container {background:#ff0;width:100%;}
header {}
#main {}
footer {background:#999;}

【讨论】：