问题: 一个页面分上下二部分,上部分高度是固定不变的,要求下部分高度自动占满屏幕,如何实现?

第一感觉是准备用 JS 实现。

今天发现一个用 CSS 实现的方法

position: fixed;
bottom: 10px;
overflow: auto;
left: 0px;
top: 44px;

position 说明:

http://www.w3school.com.cn/cssref/pr_class_position.asp

http://developer.51cto.com/art/201009/226526.htm

div 自动高度的更多相关文章

  1. (转载)html中div使用自动高度

    为什么要使用div标签 1.更多的配置项,那就意味着更灵活,当然,难度也更高: 2.可以方便的容纳其他html标签:     static定位就是不定位,出现在哪里就显示在哪里,这是默认取值,只有在你 ...

  2. div 自动全屏高度

    最近做一个页面,需要一个div自动铺满全屏,但是高度总是难以搞定.查资料为:需要从html body到div 需要 设置 高度属性 为100%

  3. 两个div,高度都是100% 用 display:flex; 和 min-height 一边撑高了,另一边自动走 (不加flex不自动撑开)

    两个div,高度都是100% 用 display:flex; 和 min-height 一边撑高了,另一边自动走

  4. div自适应高度

    div自适应高度 Div即父容器不根据内容自适应高度,我们看下面的代码: <div id="main"> <div id="content"& ...

  5. DIV布局-高度不同DIV,自动换行并对齐

    最近弄了一个动态添加div框,每个div框内容有多有少,要支持div高度自适应,还要添加的div自动追加,并且换行还要保持每行对齐. 刚开始的效果: 要改啊,搞不定,问了UI高手,终于给出了完美解决方 ...

  6. 并列div自动等高

    并列div自动等高 方法一:css控制 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  7. Html 之自动高度 auto 和 100%高度

    HTML 高度 下面示例 设置为 Auto 和 100% <!DOCTYPE html> <html lang="en"> <head> < ...

  8. css实现div的高度填满剩余空间

    css实现div的高度填满剩余空间 .top{ width: 100%; height: 70px;} .bottom{background-color: #cc85d9;width: 100%;po ...

  9. html小知识点汇总(浏览器导航上显示图标、div无高度时试着清除浮动、文字环绕图片、字体加粗、div按百分比分、已有的不合适的class,针对特定的标签进行修改)

    1.新点击的网页,在浏览器导航上显示图标: 像这种效果: <head> <meta charset="UTF-8"> <meta name=" ...

  10. 里面的div怎么撑开外面的div,让高度自适应

    关于容器高度自适应的兼容性问题.1.有些时候,我们希望容器有一个固定高度,但当其中的内容多的时候,又希望高度能够自适应,也即容器在纵向能被撑开,且如果有背景,也能够自适应.在一般情况下,使用min-h ...

随机推荐

  1. 麒麟v10系统安Influxdb2.0教程

    1.下载安装包:wget https://dl.influxdata.com/influxdb/releases/influxdb2-2.1.1-linux-amd64.tar.gz 2.解压 tar ...

  2. uniapp 返回上一页事件监听

    需求 点击订单页---订单详情页----点击修改地址---来到地址列表,修改地址--- 成功以后返回订单详情页,并且更新界面数据 首先在订单详情页   设置事件  监听另一界面触发事件后  就会执行并 ...

  3. lg9019题解

    容易发现,向左跳是不优的. 而且除了最后一次跳跃,每次跳跃一定跳到现在能够跳到的最右的区间. 设\(r_i\)表示第\(i\)个区间能够跳到的最右的区间,\(l_i\)表示第\(i\)个区间能够跳到的 ...

  4. myql数据库新建之后,本地可以访问,远程访问不了

    通过如下命令去修改: use mysql; update user set user.Host='%' where user.User='root'; flush privileges;

  5. vue真实项目结构

    我明白你的需求.如果你想看一个真实企业项目使用的复杂目录结构,你可以参考以下几个例子: 根据1的介绍,一个vue项目的目录结构可以细分为以下几个部分: |- src | |- api 存放所有请求接口 ...

  6. 【易语言】exui超级列表框使用方法

    优秀例程1 黑鸟 https://jiucaiwl.lanzoum.com/iLq8B0oswkuf

  7. 查看docker 运行的参数 pip3 install runlike runlike 容器ID

  8. 088_BatchApex_Callout

    global class BatchSync implements Database.Batchable<sObject>, Database.AllowsCallouts { publi ...

  9. vue去除富文本的标签和样式

    vue利用正则去除富文本的标签和样式 ts: const removeHtmlStyle =(html :any)=> { let relStyle = /style\s*?=\s*?(['&q ...

  10. mysql报错This function has none of DETERMINISTIC. NO SOL or READS SOL DATA...

    是因为 存储过程/存储函数在创建时 与 开启慢查询日志冲突了 解决冲突: 临时解决:开启log_bin_trust_function_creators show variables like '%lo ...