转行学开发,代码100天——2018-04-03

2.6 align-content属性

align-content 属性定义了在交叉轴方向对齐方式和额外空间分配,类似于justify-content的作用。

align-content: stretch ||flex-start||flex-end||center ||space-between ||space-around

3.flex项目属性

3.1 order 属性

order 属性定义项目在容器中的先后顺序

order:1;

3.2 flex-grow属性

flex-grow 属性定义项目的放大比例,其值是一个单位的正整数,表示放大的比例,默认为0。

flex-grow:2;

3.3 flex-shrink属性

flex-shrink属性定义了项目的缩小比例,默认为1,负值无效。

flex-shrink:2;

3.4 flex-basis 属性

flex-basis属性定义了项目在分配额外空间之前的缺省尺寸。属性值可以是长度(20%)或者auto。

flex-basis:auto;

3.5 flex 属性

flex是flex-grow flex-shrink flex-basis的简写,默认为0 1 auto;后两个属性可选属性。

flex:none;

3.6  align-self 属性

align-self属性定义项目的对齐方式。默认值是auto,即继承父元素的align-items属性,如果没有父元素,则等同于stretch。

align-self: auto || flex-start||flex-end||center||baseline||stretch

day18—Flex弹性布局详解(二)的更多相关文章

  1. day17—Flex弹性布局详解(一)

    转行学开发,代码100天——2018-04-02 今天看到一篇大神的文章,关于flex布局的详解,对flex用法介绍的相当详细,非常有助于我等初学者更深入了解这种布局方式. 文章链接 [基础知识]Fl ...

  2. Android 布局学习之——Layout(布局)详解二(常见布局和布局参数)

    [Android布局学习系列]   1.Android 布局学习之——Layout(布局)详解一   2.Android 布局学习之——Layout(布局)详解二(常见布局和布局参数)   3.And ...

  3. 弹性布局详解——5个div让你学会弹性布局

      前  言 JRedu 在网页制作过程中,布局是我们最重要的一个环节.可以说布局的好坏直接影响到整个网页的成败!布局成,则事半功倍:布局败,则事倍功半. 随着移动互联的到来,响应式网站风靡.这也就兴 ...

  4. css--flex弹性布局详解和使用

    前言 前端开发最基础的能力是根据 ui 设计稿迅速还原页面,拿到设计稿不要急于写代码,首先要对页面进行分析,对页面的整体布局有个大概的了解,然后先实现一个整体的布局,再把布局拆分成逐个小模块,逐个去实 ...

  5. flex弹性布局属性详解!

    详细看下flex弹性布局具体属性: flex容器属性详解:flex-direction:row/column:(横排/竖排) 决定元素的排列方向:flex-wrap:nowrap/wrap/wrap- ...

  6. 弹性盒布局详解(display: flex;)

    弹性盒布局详解 弹性盒介绍 弹性盒的CSS属性 开启弹性盒 弹性容器的CSS属性 flex-direction设置弹性元素在弹性容器中的排列方向 主轴与侧轴(副轴) flex-wrap设置弹性容器空间 ...

  7. css进阶之二:flex弹性布局

    布局模式是指一个盒子与其兄弟.祖先盒的关系决定其尺寸与位置的算法.css2.1中定义了四种布局模式,分别是块布局.行内布局.表格布局.以及定位布局.css3引入了新的布局模式Flexbox布局,灵活度 ...

  8. Grid 网格布局详解

    Grid网格布局详解: Grid布局与Flex布局有着一定的相似性,Grid布局是将容器划分成行和列,产生单元格,可以看做是二维布局. 基本概念: 采用网格布局的区域,称为"容器" ...

  9. Android布局详解之一:FrameLayout

      原创文章,如有转载,请注明出处:http://blog.csdn.net/yihui823/article/details/6702273 FrameLayout是最简单的布局了.所有放在布局里的 ...

随机推荐

  1. JAVA总结--java基本语法

    static :静态的~ static :静态变量.静态方法: 被修饰的成员变量或者方法独立于该类的任何对象,只要该类被加载,被修饰的成员变量或者方法就存在并可以使用.  用public修饰的stat ...

  2. JavaScript ES6中export、import与export default的用法和区别

    前言 相信很多人都使用过export.export default.import,然而它们到底有什么区别呢? 在看他们之间的区别之前,我们先来看看它们的用法. ES6 import和export的用法 ...

  3. 2101 可达性统计(拓扑排序/dfs+状态压缩)

    [题目描述] 给定一张N个点M条边的有向无环图,分别统计从每个点出发能够到达的点的数量.N,M≤30000. [题目链接] 2101 可达性统计 [算法] 拓扑排序之后逆序计算(感觉dfs更好写而且应 ...

  4. Mysql8- Public Key Retrieval is not allowed

    在使用 MySQL 8.0 时重启应用后提示 com.mysql.jdbc.exceptions.jdbc4.MySQLNonTransientConnectionException: Public ...

  5. Linux基础命令一(补充)

    echo ls ls–l  ---- ll cd /  根目录 cd ~ cd -   返回上一个目录 env ip addr 显示物理网络地址,缩写:ip a /etc/init.d/network ...

  6. MacBook Pro修改hosts

    访达前往:/etc/hosts 将hosts复制到桌面修改保存 替换 附Windows hosts文件位置: C:\windows\System32\drivers\etc

  7. Java架构师需要掌握的技术栈

  8. 8-基于双TMS320C6678 + XC7K420T的6U CPCI Express高速数据处理平台

    基于双TMS320C6678 + XC7K420T的6U CPCI Express高速数据处理平台 1.板卡概述 板卡由我公司自主研发,基于6UCPCI架构,处理板包含双片TI DSP TMS320C ...

  9. 了解Greenplum (2)

    一.目的 1. 理解Greenplum中的数据分布策略(random 和 distribution),分析不同分布策略的优劣:2. 理解查询执行中的数据广播和数据重分布,分析在何种情况下选择哪种策略, ...

  10. Firewalld--02 端口访问/转发、服务访问、源地址管理

    目录 防火墙端口访问/转发.服务访问.源地址管理 1. 防火墙端口访问策略 2. 防火墙服务访问策略 3.防火墙接口管理 4.防火墙源地址管理 5. 防火墙端口转发策略 防火墙端口访问/转发.服务访问 ...