容器(父元素)的属性:

flex-direction属性决定主轴的方向

flex-wrap 属性决定项目在一行排不下的情况下是否换行

flex-flow flex-flow属性是flex-direction属性和flex-wrap属性的简写形式,默认值为row nowrap

jstify-content    justify-content属性定义了项目在主轴上的对齐方式

align-items 属性定义了每行项目在側轴方向上的对齐方式\

align-content属性 align-content属性定义了容器在側轴方向上有额外空间时怎样排布

子容器

order属性     order属性定义项目的排列顺序。数值越小排列越靠前,默觉得0,可能的值为随意整数。

flex-grow属性 flex-grow属性定义项目的放大比例,默觉得0,即假设存在剩余空间也不放大。

flex-shrink属性 flex-shrink属性定义了项目的缩小比例,默觉得1。即假设空间不足该项目将缩小。

flex-basis 属性定义了在分配多余空间之前,项目占领的主轴空间(main-size)。

flex属性   flex属性是flex-growflex-shrink 和 flex-basis的简写,默认值为0 1 auto

align-self属性 align-self属性同意单个项目有与其它项目不一样的側轴对齐方式,可覆盖align-items属性。

flex的12个属性的更多相关文章

  1. 关于flex,好像有12个属性非常重要

    关于Flex,有12个属性非常重要 这几天在学习Flex布局,发现Flex真的好厉害! Flex是Flexible Box的缩写,意为"弹性布局",用来为盒模型提供最大的灵活性. ...

  2. Flex的 Event中属性currentTarget与target的区别

    Flex的 Event中属性currentTarget与target的区别 1.区别 (1)currentTarget是事件的处理对象(event processor) (2)target是事件的调用 ...

  3. Flex的 Event中属性currentTarget与target的差别

    Flex的 Event中属性currentTarget与target的差别 1.差别 (1)currentTarget是事件的处理对象(event processor) (2)target是事件的调用 ...

  4. flex三个对齐属性的记忆方式

    今天在群里聊天有人说 flex的那几个居中属性好难记,时不时都要尝试一下,或者查看一下文档,现在我把我自己的记忆方式分享一下... 1. flex的居中主要是通过这三个属性来实现的: justify- ...

  5. Flex布局教程及属性速查

    一.Flex布局介绍 伸缩盒模型(flexbox)是一个新的盒子模型,意为"弹性布局",用来为盒状模型提供最大的灵活性,主要优化了UI布局.Flexbox的功能主要包手:简单使用一 ...

  6. CSS3动画属性和flex弹性布局各个属性

    [CSS3动画的使用] 1.声明一个关键帧(动画): @keynames name{ from{} to{} } 每个阶段的写法: ①可以直接使用from-to的写法 ②可以设置0%-100%的写法, ...

  7. 12.vue属性.监听.组件

    1.计算属性 https://cn.vuejs.org/v2/guide/computed.html new Vue({ computed:{//定义 show(){ } } }) ++计算属性1.h ...

  8. Flex布局-项目的属性

    Flex项目有以下6个属性: order flex-grow flex-shrink flex-basis flex align-self order属性定义项目的排列顺序.数值越小,排列越靠前,默认 ...

  9. Flex布局-容器的属性

    本文部分内容参考阮一峰大神博客,原文地址:http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html Flex布局即弹性布局,使用起来十分方便灵活 ...

随机推荐

  1. 12 oracle 数据库坏块--物理坏块-ORA-01578/ORA-01110

    oracle 数据库坏块--物理坏块 数据坏块的类型物理坏块:通常是由于硬件损坏如磁盘异常导致.内存有问题.存储链有问题. IO有问题.文件系统有问题. Oracle本身的问题等逻辑坏块:可能都是软件 ...

  2. SSLPinning简介,使用Xposed+JustTrustMe来突破SSL Pinning

    0x00 前面 如果你是一干Web安全的,当你在测试目前大多数的手机APP应用程序时,你一定遇到过burpsuite无法抓到数据包的情况,开始你以为只是https的问题,但是当你使用了burpsuit ...

  3. 【BASIS系列】SAP 日志管理

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[BASIS系列]SAP 日志管理   前言部分 ...

  4. 数据库之DML

    1.表的有关操作: 1.1.表的创建格式: CREATE TABLE IF NOT EXISTS 表名(属性1 类型,属性2 类型,....,属性n 类型):# 标记部分表示可以省略 1.2.表的修改 ...

  5. 【计算机视觉】HDR之tone mapping简介

    tone Mapping原是摄影学中的一个术语,因为打印相片所能表现的亮度范围不足以表现现实世界中的亮度域,而如果简单的将真实世界的整个亮度域线性压缩到照片所能表现的亮度域内,则会在明暗两端同时丢失很 ...

  6. BusyBox TFTP使用(转)

    开发板上使用TFTP 帮助信息: BusyBox v1.13.3 (2009-03-25 15:48:45 CST) multi-call binary Usage: tftp [OPTION]... ...

  7. [19/09/19-星期四] Python中的字典和集合

    一.字典 # 字典 # 使用 {} 来创建字典 d = {} # 创建了一个空字典 # 创建一个保护有数据的字典 # 语法: # {key:value,key:value,key:value} # 字 ...

  8. 【监控笔记】【1.2】监控事件系列——SQL Trace(默认跟踪与自定义跟踪)

    目录: [1.1]概念与使用 [1.2]跟踪的基本操作 --[1.2.1]查看默认跟踪是否在运行 --[1.2.2]开启默认跟踪 --[1.2.3]关闭默认跟踪 --[1.2.4]查看跟踪文件/查看跟 ...

  9. Java Mail 附件名太长导致接收端附件名解析出错

    问题前提:公司需要往邮件中写 excle 文件,返送成功后发现文件格式有误(如:xxxx.bat 等文件后缀),但是有些文件又不会, 后来发现是由于文件名称太长所导致. 问题原因:java mail中 ...

  10. SpringBoot、ActiveMQ整合阿里大鱼-----短信服务

    3.短信微服务 3.1需求分析 构建一个通用的短信发送服务(独立于优乐选的单独工程),接收activeMQ的消息(MAP类型)  消息包括手机号(mobile).短信模板号(template_code ...