css

 *{margin:; padding:;list-style: none;}

 .top{height: 100px;background-color:orange;}

 .max{width: 100%;position:absolute;top: 100px;bottom:;background-color:skyblue;}

html

 <div class="top">

       top

 </div>

<div class="max">

       main

 </div>

css布局一屏幕的自适应高度的更多相关文章

  1. css布局之头尾固定中间高度自适应

    被这个问题困扰了很久.大神别鄙视我,我是搞后台开发的....试过了很多方法,比如设定高度100%.同事用的js计算高度,我对js设置的方式一直觉得不够好,尽管设置高度为100%的方式更差,直到发现了一 ...

  2. css布局两边固定中间自适应的四种方法

    第一种:左右侧采用浮动 中间采用margin-left 和 margin-right 方法. 代码如下: <div style="width:100%; margin:0 auto;& ...

  3. DIV+CSS布局时， DIV的高度和宽度特性

    这个没有特别的做要求,你要根据你自己的页面整体布局来设置,还有根据div的特性来设置,div默认情况是宽度最大化(100%).高度最小化,高度随着内容自动伸展: 一般情况做网页的话,大部分都是固定了总 ...

  4. css布局两端固定中间自适应

    第一种:采用浮动 1.1首先来看一下网上一个哥们给的代码 <body> <div class="left">左</div> <div cl ...

  5. DIV+CSS布局中自适应高度的解决方法

    div乱跑问题  (文件<DIV+CSS布局中自适应高度的解决方法.rar>)   float 是个很危险的东西 得小心使用 本来有一很好的关于CSS+DIV的论坛 不过现在关门了 甚是可 ...

  6. 简单而兼容性好的Web自适应高度布局，纯CSS

    纯CSS实现的自适应高度布局,中间内容不符自动滚动条.兼容IE9以上.chrome.FF.关键属性是box-sizing: border-box. 不废话,直接上代码: <!doctype ht ...

  7. CSS 布局实例系列（三）如何实现一个左右宽度固定，中间自适应的三列布局——也聊聊双飞翼

    今天聊聊一个经典的布局实例: 实现一个三列布局,其中左侧和右侧的部分宽度固定,中间部分宽度随浏览器宽度的变化而自适应变化 可能很多朋友已经笑了,这玩意儿通过双飞翼布局就能轻松实现.不过,还请容我在双飞 ...

  8. DIV+CSS左右两列自适应高度的方法

    我们在用DIV+CSS布局网页的时候,必然会遇到左右两列自适应高度的问题,就是左边列的背景会随着右边列内容的增加也相应的增加高度,下面就教大家DIV+CSS左右两列自适应高度的方法. 下面给出最终的效 ...

  9. CSS自适应布局(左右固定 中间自适应或者右侧固定 左侧自适应)

    经常在工作中或者在面试中会碰到这样的问题,比如我想要个布局 右侧固定宽度 左侧自适应 或者 三列布局 左右固定 中间自适应的问题. 下面我们分别来学习下,当然我也是总结下而已,有如以下方法: 一: 右 ...

随机推荐

  1. IO流（9）复制指定文件夹下指定文件到目的文件夹，并改名

    import java.io.BufferedInputStream;import java.io.BufferedOutputStream;import java.io.File;import ja ...

  2. 005-四种常见的 POST 提交数据方式

    1.http请求方法 HTTP Method RFC Request Has Body Response Has Body Safe Idempotent Cacheable GET RFC 7231 ...

  3. $scope.$apply

    对于一个在前端属于纯新手的我来说,Javascript都还是一知半解,要想直接上手angular JS,遇到的阻力还真是不少.不过我相信,只要下功夫,即使是反人类的设计也不是什么大的问题. Okay, ...

  4. Android APP安装后不在桌面显示图标的应用场景举例和实现方法

    最近在为公司做一款车联网的产品,由于公司本身擅长于汽车解码器的研发,所以该产品的诊断功能的实现除了使用目前市面上车联网产品中大量使用的OBD协议外,还会使用一些专车专用协议去实现一些特殊的诊断功能,如 ...

  5. testng入门教程8 TestNG异常测试

    TestNG跟踪异常处理代码提供了一个选项.可以测试是否需要代码抛出异常或不抛出. @Test注释expectedExceptions 参数一起使用.现在,让我们来看看@Test(expectedEx ...

  6. html select 和dropdownlist小结收集

    //html select var x = $("#selectSort").val();  //获取选中的value值 获取select选中的索引: $("#selec ...

  7. 024-linux中动态库libXXX.so

    1.动态库的概念.动态链接库与普通的程序相比而言,没有main函数,是一系列函数的实现.通过shared和fPIC编译参数生产so动态链接库文件.程序在调用库函数时,只需要连接上这个库即可. 2.动态 ...

  8. npm包上传下载的命令及例子

    npm包上传下载的命令及例子. 新建hello.js 执行:npm init 执行:npm adduser ( username:XXX password:XXX email:XXX ) 上传:npm ...

  9. camera原理

    1)Color Filter Array---CFA 图像传感器都采用一定的模式来采集图像数据,常用的有 BGR 模式和 CFA 模式.BGR 模式是一种可直接进行显示和压缩等处理的图像数据模式,它 ...

  10. 《Enhanced LSTM for Natural Language Inference》（自然语言推理）

    解决的问题 自然语言推理,判断a是否可以推理出b.简单讲就是判断2个句子ab是否有相同的含义. 方法 我们的自然语言推理网络由以下部分组成:输入编码(Input Encoding ),局部推理模型(L ...