父级的宽度： 375

用来每个子元素的宽度：40

设置了  flex：1，每个子元素的宽度为125

125*3= 375，

设置flex=1后子元素会平均的分配父级元素剩下的宽度

设置flex 为1的更多相关文章

  1. chrome 49 版本bug: flex父元素设置flex:1 , 子元素用height:100%无法充满父元素

    1 <div class="container"> <div class="item"> <div class="ite ...

  2. 伸缩容器-display：flex设置flex属性的理解

    1.flex属性 1.1 flex属性是flex-grow, flex-shrink 和 flex-basis的简写,默认值为0 1 auto. flex-grow: 定义项目的放大比例,默认为0,即 ...

  3. Flex中设置Camera的视频清晰质量的最佳配合

    今天需要设置Flex中的Camera组件的一些属性,后来发现清晰度不是很高,于是捣鼓了上午半天,设置了很多的参数,竟然发现手册上就是有现成的一些设置方法,郁闷!不过我还是专门设置了几个有用和必要的属性 ...

  4. flex布局设置width无效

    子元素设置 : flex: 0 0 85px; 参数: flex属性是flex-grow, flex-shrink 和 flex-basis的简写,默认值为0 1 auto.后两个属性可选. 该属性有 ...

  5. CSS3的flex布局

    flex的一些属性 CSS3中引入了另一种框--flexbox,flexbox有一些block和inline不同的性质,比如: 自适应子元素(flex item,又称伸缩项目)的宽度 伸缩项目的flo ...

  6. DarkStone - 跨平台移动应用开发之 Flex 的崛起

    我的好友Ds 发布一个flex的消息.我帮忙转发 DarkStone - 跨平台移动应用开发之 Flex 的崛起 (2013-08-20 22:28:32)     此文章由 周戈 (DarkSton ...

  7. CSS3伸缩布局Flex学习笔记

    如果需要使用伸缩布局首先得把display:flex;对于兼容还得加前缀display:-webkit-display:flex;等其他浏览器前缀,但我本机Chrome测试已经不需要加前缀了,其实这些 ...

  8. CSS旧版flex及兼容

    × 目录 [1]适用范围 [2]伸缩项目 [3]伸缩流方向[4]伸缩流换行[5]主轴对齐[6]伸缩性[7]显示顺序[8]flex兼容 前面的话 flex弹性盒模型有3个版本: 旧版本.混合版本和新版本 ...

  9. Flex知识备忘

    div被flex遮挡 //如果设置z-index无效,那么设置flex加载参数 params.wmode = "Opaque";

随机推荐

  1. Python全栈开发，Day2

    一.Pycharm的使用 1.创建项目 2.python调整字体大小随ctrl+鼠标滚轮上下滚动 3.python新建程序自动补全编码和环境 4.设置断点(在代码前面行号后面单击鼠标左键) 5.调试断 ...

  2. sts创建maven项目 引入spring，报错

    症状: Missing artifact org.springframework:spring-core:jar:5.0.0.RC3 原因: 在引入之前没有设置spring版本号 和spring ur ...

  3. 攻防世界 | string

    #encoding=utf-8 #!usr/bin/python from pwn import * io = remote('111.198.29.45',42643) io.recvuntil(& ...

  4. CTF_工具网址收藏

    杂项 条形码在线扫描 :    https://online-barcode-reader.inliteresearch.com/ PS弄反色ctr+i    :  https://zhidao.ba ...

  5. python中将12345转换为54321

    #将12345转换为54321 a = 12345789 ret = 0 #当a不为零的时候,循环条件为true,执行语句块 while a : #对a求余数,第一次循环则把5求出来 last = a ...

  6. LintCode之左填充

    题目描述: 分析:由样例可知,第二个参数表示要返回的字符串的最小长度,所以当给定字符串的长度小于规定字符串最小长度时就在左边填充空格,另外还有一个重载方法leftpad的第三个参数指定左边填充的字符. ...

  7. （转）jupyter常用快捷键

    转:http://www.mamicode.com/info-detail-2395285.html Jupyter Notebook 有两种键盘输入模式.即命令模式和编辑模式,这与 vim有些类似. ...

  8. codeforces 380A Sereja and Prefixes （递归）

    题目: A. Sereja and Prefixes time limit per test 1 second memory limit per test 256 megabytes input st ...

  9. Codeforces D. Array Division

    题目链接:http://codeforces.com/contest/808/problem/D 题意: 这一题给你一个数组,你可以调换某一个数的位置,使得这个数组可以分成2半,前半段的和等于后半段( ...

  10. php面试专题---16、MySQL创建高性能索引考点

    php面试专题---16.MySQL创建高性能索引考点 一.总结 一句话总结: 注意:只写精品 1.索引的基础? 类似书籍的目录:索引类似于书籍的目录,要想找到一本书的某个特定主题,需要先查找书的目录 ...