html,body{height:100%}

.wraper{
display:flex;
flex-direction:column;
height:100%;
flex-wrap: nowrap; } div{
border:1px solid red;
} .top{
height:20px;
} .mid{
border:1px solid green;
flex:1;
} .bottom{
height:20px;
}

  

  <div class="wraper">
<div class="top"></div>
<div class="mid"></div>
<div class="bottom"></div>
</div>

JS Bin on jsbin.com

flex 3 rows layout的更多相关文章

  1. Flex 容器基本概念

    申明文章出处:http://www.adobe.com/cn/devnet/flex/articles/flex-containers-tips.html Flex 4 容器可以提供一套默认的布局:B ...

  2. 【Flex】自定义组件学习

    文件列表 主文件: index.mxml 自定义组件  components.mylogo.mxml 图img  a.jpg 2 mylogo.mxml <s:Group xmlns:fx=&q ...

  3. [C1] C1FlexGrid 行列增删&单元格合并拆分

    上一篇中实现了 C1FlexGrid的撤销还原功能,这篇是要仿 Excel 做一个行列删除以及单元格的自由合并拆分,楼主怕在原工程里复杂的说不清道不明,所以干脆提取出来做了一个 Demo 来说明实现过 ...

  4. 使用Flex4容器若干技巧

    本文适用于正在寻找使用Flex 4容器和布局的快速参考指南的开发人员. 尽管这不一定是一个复杂问题,但这似乎是许多开发人员的挫折的来源,特别是对于那些Flex刚刚入门的开发人员. 当开发人员不知道如何 ...

  5. Flex4之皮肤定制

    Flex4之皮肤定制[Skin类和Skin类]          博客分类: RIA-Flex4专栏 FlexAdobeUPFlashUI 第一.关于spark.skin.SparkSkin类的 1. ...

  6. 记录一个简单的vue页面实现

    <template> <div class="userView"> <!-- 页眉颜色统一 --> <div class="bu ...

  7. 测试用例Excel模板For Quality Center

    Subject Test Name Description Step Name  Step Description Expected Result PU Regr\Component\Attribut ...

  8. 知识共享图文直播---(一)将数据库中的数据加载到MSFlexGrid空间中再导入Excel

    熟话说万物皆有其存在的道理,为什么我突然想写<知识共享图文直播>这个系列呢?首先,我想的是记录自己学习的历程,在记录中加深自己对知识的理解,同时也希望自己的博文能帮助到其他数据库的初学者. ...

  9. 首个vue.js项目收尾中……

    前言: 4.26号入手vue.js+elementUI,迄今为止我们的工作应该可以暂时告一段落了:下周开始,又是新的“征程”. 过程:站在接近完成的角度来看这个项目,似乎的确有许多事情需要自己阐述. ...

随机推荐

  1. Level 4 A10: 飞张?

    看来庄家的红桃2个输张没法解决,只能寄希望于飞K了. 但如果将牌2-2分布,还有更稳的打法.在下面这种东家3张黑桃的情况时,庄家只需垫到红桃2就行了. 如果东家有4张黑桃,那就只有飞红桃K这一条路了.

  2. 如何在Eclipse卸载之前添加的android 的 ADT

    Android开发环境配置中,怎么卸载ADT? 在Android开发环境配置中,可能会遇到很多问题,其中ADT安装失败需要卸载,怎么卸载呢?下面讲一种方法,希望能够对你有所帮助. 我采用的是Eclip ...

  3. 错误:升级为xcode8之后无法上网的解决方法

    主要是在info.list中增加以下的节点,因为XCode开始所有的http都转为https来联网了. 添加类型为Dictionary的:NSAppTransportSecurity 再添加节点为:N ...

  4. 【读书笔记】iOS-UIWindow-密码框

    一,工程结构,如下图所示: 二,代码 PasswordInputWindow.h #import <UIKit/UIKit.h> @interface PasswordInputWindo ...

  5. 异步get请求之Block方法

    #import "ViewController.h" #import "Header.h" @interface ViewController ()<NS ...

  6. Effective Java 27 Favor generic methods

    Static utility methods are particularly good candidates for generification. The type parameter list, ...

  7. 深入掌握Java中的enum

    对于要在程序中要表示有限种类的某事物,一般我们可以采用两种方式,一是使用:public static final String 常量:二是使用enum来表示.一般而言前者简单,但是不能够很好的提供更多 ...

  8. 魔改——MFC MDI程序 定制 文档模板 运行时全部打开 禁用关闭按钮

    ==================================声明================================== 本文原创,转载在正文中显要的注明作者和出处,并保证文章的完 ...

  9. cookie的读入和读出

    写入cookie中 在mvc的控制器中 HttpCookie GetUserID = new HttpCookie("uID", 要保存的值); GetUserID.Expires ...

  10. HBase 高性能加入数据 - 按批多“粮仓”式解决办法

    摘要:如何从HBase中的海量数据中,以很快的速度的获取大批量数据,这一议题已经在<HBase 高性能获取数据>(http://www.cnblogs.com/wgp13x/p/42451 ...