莫说相公痴，更有痴似相公者。 —— 张岱《湖心亭看雪》
是什么
calc: 是css3新增的用于计算容器数值的计算函数，基于数学角度计算一个元素的数值
(flex:1)：是flex布局对于剩余空间的声明，表示占据所有剩余空间
关联与区别
calc与flex:1在做响应式布局时目的相同，尤其是在固定容器+不定容器时尤为适配。
假设对同一元素进行不定宽高设计：
calc：根据总单位长度 -某固定元素值得出当前值作为剩余空间，简单的数学思维
(flex:1): 此元素父级进行flex声明，此元素声明flex:1 表示此元素占据剩余空间，凡是需要固定值得都须定义为flex-shirk:0声明为固定宽高元素
优缺点
calc: 单纯数学计算，但是考虑到不同屏幕宽高以及缩放，固定值的数据可能不准确，从而导致最后计算数据失真。 每次新增固定容器的时候，所有与之相关的计算函数都要重新修改。
但是不止用来布局
flex:1 : 布局自适应宽高，但是会有min-height问题，如果没有设置min-height:0 ，将会导致内部容器超出当前设置容器。只能用来布局
建议与总结
布局使用flex:1
计算别的再使用calc
以上。
（flex:1） ：