拉伸div以填充body

2023-12-25

<html style="margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;">
    <body style="height:100%;width:100%;">
        <div style="height:20px;background-color:red;"></div>
        <div style="background-color:black;"></div>
        <div style="height:20px;background-color:blue;"></div>
    </body>
</html>

如何使第二个 div 拉伸以填充主体中的剩余空间(放置第一个和第三个 div 后)?


如果您想要粘页脚系统,请使用以下技术:

* {
    margin: 0;
}

html, body {
    height: 100%;
}

.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -20px;
}

.footer, .push {
    height: 20px;
}

http://ryanfait.com/resources/footer-stick-to-bottom-of-page/ http://ryanfait.com/resources/footer-stick-to-bottom-of-page/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

拉伸div以填充body 的相关文章

随机推荐

  • “空间”数据的平滑

    我有2个变量x and y它们是 0 1 处的笛卡尔坐标 以及z是这些坐标处的 连续 变量的值 这z向量有一些重要的异常值 x lt sample seq 0 1 0 001 replace F y lt sample seq 0 1 0
  • LVM2:无法创建块设备

    我正在尝试利用LVM2Linux Centos6 0 中的功能 当尝试在特定块设备上定义 PV 的第一步时 我收到以下错误消息 root localhost pvcreate dev sdb 无法以独占方式打开 dev sdb 挂载的文件系
  • 由于 Keycloak 默认登录重定向而导致混合内容错误

    所需信息 我在 Spring 项目后面使用 Keycloak Docker 版本 该项目的客户端是React 客户端和后端之间的通信由REST服务提供 客户端是安全的并使用 https 方案 这是我的 Spring 配置 keycloak
  • 将空值添加到 ASP.net MVC 中的 DropDownList

    我正在构建一个数据输入界面 并已使用 DropDownList 成功绑定了具有数据参考表的列 以便用户从预配置的值中进行选择 我现在的问题是 我不希望默认选择第一个值 我需要强制用户从列表中选择一个值 以避免出现错误 因为他们没有选择该字段
  • CodeIgniter 负载控制器视图

    有没有办法从视图加载控制器 这就是我所追求的 我想多次使用一个视图 但该视图是由单独的控制器加载的 该控制器提供视图和来自数据库的信息 因此 由于来自模型的信息 我不能只设置 this load gt view 等等 有没有办法做这件事 或
  • JNI 在应用程序中检测到错误:调用 JNI GetMethodID 时出现未决异常 java.lang.ClassNotFoundException:未找到类

    我收到以下错误 JNI 在应用程序中检测到错误 调用 JNI GetMethodID 时出现未决异常 java lang ClassNotFoundException 在路径上找不到类 package name class DexPathL
  • HTTPS 的代理 Servlet

    我有一个安全站点 需要在某些页面上显示来自外部非 https URL 的图像 我想创建一个 servlet 仅用作将图像数据传递到页面的代理 一种方法是使用 Apache 的 HttpClient 下载图像数据 然后使用 IOUtils c
  • a href=javascript:function() 在 Firefox 中不起作用

    我尝试使用a href javascript function 在一个按钮中 并带有执行它的函数 它在 Chrome 中工作 但在 Firefox 中不起作用 Firefox 不会发出警报并打开空白选项卡 有人可以帮助我吗 下面是按钮代码
  • Eclipse + Egit:将项目克隆到工作区

    我对它是如何工作的有点困惑 我在 Github 上有一个现有的 git 存储库 并且想将其克隆到我的工作区中 我的目标是将本地存储库直接存储在我的工作区文件夹中 但我无法将其与 EGit 一起使用 当我想使用 EGit 克隆 github
  • 如何用 Jest 模拟/替换对象的 getter 函数?

    在Sinon我可以做以下事情 var myObj prop foo sinon stub myObj prop get function getterFn return bar myObj prop bar 但我怎样才能对 Jest 做同样
  • 究竟什么是“执着无明”?

    持久性无知通常被定义为持久和检索标准 NET 对象 或 POCO 如果您确实坚持给它们命名 的能力 还有一个标准 NET 对象的定义似乎已被广泛接受 http msdn microsoft com en us magazine dd8825
  • 在javascript中获取div位置(顶部)?

    我使用 css 设置了一个 div 的高度top 26px 我在其他地方还有其他 div 我想与该 div 保持一致 我注意到jquery写作 css top 获取我的 css 而不是 div 的 y 坐标 如何使用 javascript
  • Hibernate 不等于示例标准

    Hibernate 有示例标准 例如 Example equal Example create mydbObject 有没有办法反其道而行之 例如 Example notEqual Example createNotEqual mydbOb
  • 如何在 SBT 中刷新更新的 Git 依赖项?

    我已经配置了 SBT 0 11 0 以将 GitHub 项目作为依赖项拉入 按照我的回答这个问题在这里 https stackoverflow com questions 7550376 how can sbt pull dependenc
  • 在AWS CDK中执行代码之前如何等待堆栈完成?

    我正在尝试 AWS CDK 但当我尝试执行依赖于堆栈完成的代码块时 我陷入了困境 这是我当前的代码 class Application extends cdk Construct constructor scope cdk Construc
  • 如何编写一个函数来比较多组布尔(真/假)答案并对其进行排名?

    我已经开始了一个项目 事实证明它比我最初想象的要复杂得多 我正在尝试规划一个基于布尔 真 假 问题和答案的系统 系统上的用户可以回答大量布尔 真 假 问题中的任何问题 并根据他们的答案看到一个显示最相似用户 按相似度顺序排列 的列表 我在谷
  • 静态容器已经有一个与之关联的内核

    部署到 Azure 时出现与 Ninject 相关的错误 The static container already has a kernel associated with it 但在本地运行良好 而且之前它一直在本地和 Azure 上运行
  • Python 中的 Webdriver 屏幕截图

    使用python在windows上使用Selenium Webdriver进行屏幕截图时 屏幕截图直接保存到程序的路径中 有没有办法将 png文件保存到特定目录 Use driver save screenshot path to file
  • 允许用户选择图像的相机或图库

    我想做的事情看起来很简单 但经过几天的搜索 我不太明白 我有一个应用程序 允许用户选择多个 最多 5 个 图像 我正在使用一个ImageView 当用户点击ImageView 我想让他们选择 从图库中选择图像 或 使用相机捕捉图像 我开始使
  • 拉伸div以填充body

    div style height 20px background color red div div style background color black div div style height 20px background col