使垂直菜单高度适合 100%

2024-02-11

我画了一张草图https://i.stack.imgur.com/NiSi8.jpg https://i.stack.imgur.com/NiSi8.jpg所以侧边栏必须与内容侧边栏一起一直向下拖动。


它的高度应该是 100% 以及它的所有父级 div

html, body{
    height:100%;
    width: 100%;
}
.container{
    width:100%;
    height:100%;
    border:1px solid red;
}
.sidebar{
    width:25%;
    height:100%;
    background:gray;
}

http://jsfiddle.net/ahmedskaya/Bek9L/1863/ http://jsfiddle.net/ahmedskaya/Bek9L/1863/

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

使垂直菜单高度适合 100% 的相关文章

  • 两个 Div 之间的固定宽度间隙

    有谁知道如何修复两个 div 之间的间隙 我有一个主要内容 Div 里面有两个带有图片的 Div 视图的宽度为 768 像素 当我开始拉伸视图时 两张图片开始相互远离 但理想情况下 主要内容 Div 应该在周围有空白的情况下拉伸 并且图片之
  • 通过 JavaScript 检测浏览器换行

    我需要 javascript 来检测每个浏览器包装的文本行并将其包装到 span class line 我读过一些关于测量每个单词的 y 轴的文章 但还没有看到可靠的解决方案 这是我到目前为止所拥有的 看到它Jsfiddle http js
  • 使用纯javascript选择最接近id的id

    div div TEXT div div div div TEXT div div div TEXT div 如何选择最接近div1的div2 关注w3docs https www w3 org TR html4 struct global
  • 为什么在 HTML 中使用 onClick() 是一种不好的做法?

    我多次听说使用 JavaScript 事件 例如onClick 在 HTML 中是一种不好的做法 因为它不利于语义 我想知道以下代码有什么缺点以及如何修复 a href link a 你可能正在谈论不引人注目的 JavaScript htt
  • html 和 body 元素的高度

    我一直在互联网上查找 min height 和 height 属性如何在 body 和 html 元素上工作 我在很多地方都看到过下面的代码 html height 100 body min height 100 上面的内容可以与其他一些
  • Google Maps API 下拉列表,缩放至标记

    我正在使用 Google Maps API v3 我有一个带有一些标记的简单地图 我还有一个下拉列表 我需要最少的代码来完成这项工作 我想在下拉列表中选择一个标记 并将选定的标记平移到它 我已经尝试了一切并在网上查看 我发现事情很接近 但到
  • 使用 iframe 显示静态文本内容

    我有一个非常简单的要求 我有一个 div 我在其中显示一些文本内容的标签 我想在一个中显示相同的文本内容 我想要实现的目标已写在下面 有人可以帮忙吗 b div This is a content which I want to displ
  • 使用 实现可访问性的更好做法是什么?

    我有一个下载链接 但我找不到任何良好的可访问解决方案来说明如何处理这种情况 我遵循一个共同的经验法则 按钮做事 链接去地方 我的情况是 我有一个触发文档下载的按钮 同一页面 我相信这应该是一个具有按钮角色的锚点 因为它明确不触发重定向或导航
  • 在 javascript/jquery 中将光标更改为等待

    当调用函数时 如何让光标更改为此加载图标以及如何将其更改回 javascript jquery 中的普通光标 在你的 jQuery 中使用 body css cursor progress 然后又恢复正常 body css cursor d
  • 在html表格的每一行添加点击功能

    我最近创建了一个函数 它根据用户在网站中的输入进行一些复杂的名称匹配 并将结果作为表格格式的 html 文件返回 我的问题是如何在每一行添加点击功能 df get cust info returns a pandas dataframe d
  • 如何指定网站的语言? (HTML?)

    如何指定页面采用某种语言以便搜索引擎可以理解 这是我放在顶部的元标记吗 如果是 您知道大多数搜索引擎是否使用它来确定语言吗 我已将一页英文内容转换为几种不同的语言 并希望将该信息包含在 html 中 让搜索引擎知道他们正在处理哪种语言 快速
  • 使用 JavaScript 使链接保持活动状态并在单击时显示悬停效果

    I am struggling to make this work I d like to make it where if O F is clicked the hover state stays active if another li
  • 如何防止 Iframe 在与浏览器交互后弄乱浏览器的历史记录?

    因此 就我而言 我使用 Iframe 将 Grafana 附加到我的页面 这为我提供了漂亮且易于使用的图表 可以注意到 每次在图表上进行放大或缩小 使用鼠标单击 交互后 Grafana 的 Iframe 都会在我的 Angular 页面上触
  • 如何将背景图像仅应用于一个反应页面而不是整个应用程序?

    注册页面示例 register background image linear gradient to right ff5722 0 ff9800 100 margin top 150px important div div div div
  • 在requestAnimationFrame中使用clearRect不显示动画

    我正在尝试在 HTML5 画布上做一个简单的 javascript 动画 现在我的画布是分层的 这样当我收到鼠标事件时 背景层不会改变 但带有头像的顶层会移动 如果我使用 requestAnimationFrame 并且不清除屏幕 我会看到
  • 现在 CSS3 供应商前缀有多必要? [复制]

    这个问题在这里已经有答案了 我只是想知道现在在 CSS 中指定 webkit moz ms 或 o 等供应商前缀在多大程度上仍然有必要 如果我理解正确的话 opera 切换到了 webkit 所以会删除 o 对吗 IE 在 IE10 中不再
  • 我可以使用 jQuery 打开下拉列表吗

    对于 HTML 中的下拉列表
  • 为什么我不能在 AngularJS 中使用 data-* 作为指令的属性名称?

    On the t他的笨蛋 http plnkr co edit l3KoY3 p preview您可以注意到属性名称模式的奇怪行为data 在指令中 电话 Test of data named attribute br
  • 带有相对路径的 LESS CSS 背景

    我在使用 LESS 作为我的网站的样式表时遇到了问题 就我个人而言 我宁愿在CSS中使用相对路径而不是绝对路径 这只是我的习惯 但是现在当我使用带有导入功能的LESS时 我遇到了如下所示的问题 我有一个main less根文件夹中的文件 i
  • 如何获取浏览器视口中当前显示的内容

    如何获取当前正在显示长文档的哪一部分的指示 例如 如果我的 html 包含 1 000 行 1 2 3 9991000 并且用户位于显示第 500 行的中间附近 那么我想得到 500 n501 n502 或类似的内容 显然 大多数场景都会比

随机推荐