在弹性布局中，用上
flex
后发现会上瘾，因为这个属性实在太好用了。有一种情况是左边我
设置
一个子元素固定宽度，右边
设置
自适应占满剩余空间，但有时候会发现左边固定元素的宽度竟然
失效
了，被右边的元素挤占空间了，所以仔细查看
flex
属性的特点后，发现少
设置
了一些属性样式。
父元素
设置
完
display
:
flex
属性后；
子元素
设置
固定宽度：
width
:50px;
height:50;
这里加上另外一...
用平时的思想就是索引号小于2的话需要出现则会采用显示’block‘，但是
display
隐藏会使得
flex
布局
失效
（我不知道可不可把他理解为是因为
flex
布局层次低于diasplay隐藏，所以被盖住了）之前自己做的那个购物页面点击变化，就出现了隐藏头部栏返回
之后
flex
布局
失效
问题，其实解决方法很简单，就是让需要出现头部栏的页面。获取的元素.style.
display
= '
flex
'返回的是“
flex
”
ie9下，获取页面dom元素对其classList进行增删无效（控制台：无法获取未定义或 null 引用的属性“remove”/“add”…）
为了兼容可以添加以下代码。下面的第二行代码也做了ie8对于HTMLElement的兼容。
if (!("classList" in document.documentElement)) {
window...
<head>
<meta charset="UTF-8">
<meta name="viewport" content="
width
=device-wid
有些 bug，一不注意可能排查半天都排查不出来，而它恰恰又是你自己造成的…
如下 bug 效果图，卡片样式写的好好的，图片下面的详细信息字段样式代码都是同一个（最后一行土地坐落
设置
的宽度是 100%，其他几个字段都是 50%），突然最后一行土地坐落抽筋了
bug 效果
愣了一下，调了几个 CSS 属性发现还是这样…到底是
最近在做手机端的页面,制作过程出现了
flex
布局的一些问题,再次记录在解决办法关于在
flex
:1的情况下
设置
为
width
的效果如果没有
设置
width
,当内部元素的内容大小超过平均分配的剩余空间时,元素的宽度等于内容大小,如果
设置
了
width
并且这个
width
的大小小于平均分配的剩余空间大小时,取平均分配的剩余空间;当
flex
设置
为 1 时 相当于 剩余空间大小 = 父元素的宽度 因此平均的剩余空间大小等于 = 父元素的宽度 / 元素的个数,直接
设置
width
为0可以保证元素宽度平分父元素宽度。
min
-height、
min
-
width
、max-
width
、max-height的理解中的重点
在学习css的
min
-height、
min
-
width
、max-
width
、max-height这四个属性时，又遇到了一些问题和疑惑。参考了以下三个博客后把它们搞清楚了。
如何理解CSS的
min
-height、
min
-
width
、max-
width
、max-height
【css】max-height...
1、正常情况下：
width
:给块级元素/行内块 元素
设置
固定的宽度，或者固定百分比的宽度。
min
-
width
: 当盒子内部元素宽度小于
min
-
width
的值时，盒子宽度为
min
-
width
的值，当盒子内容宽度大于
min
-
width
的值时，盒子随着内容的增加而被撑大，没有上上限，但是 盒子宽度的最小值是
设置
的
min
-
width
的值。2、在父元素已经
设置
为 displa...
因为
设置
了
display
:
flex
; 导致block布局变成了
flex
布局， 所以如果想要在已经
设置
了
flex
布局的基础上，再进行子元素的宽100%
设置
的话，可以应用下面的样式：（在该子元素上
设置
）
flex
-shrink: 0;
width
: 100%;
这样就可以
生效
了。
父元素代码css代码
关键代码是
flex
-shrink: 0;
当指定view为
flex
布局后，给子元素定义
width
和height是不起效果的。原因：定义为
flex
布局元素的子元素，自动获得了
flex
-shrink的属性，这个属性是什么意思呢？就是告诉子元素当父元素宽度不够用时，自己调整自己所占的宽度比，这个
flex
-shrink
设置
为1时，表示所有子元素大家同时缩小来适应总宽度。当
flex
-shrink
设置
为0时，表示大家都不缩小适应。
所以，倘若给父元素
设置
了
flex
布局后，若要其子元素的
width
和
