诸葛生活网flex布局技巧？
最近有个面试，面试官问到，在一个横向布局上，假设有三个div，每个宽度为定宽apx，如果想使两侧宽度为x,中间div间间隔为2x。x可以自适应。
怎么做很简单，两行代码就搞定：
justify-content 常用属性有：flex-start | flex-end | center | space-between | space-around
前三个就是字面意思，向行起始位置对齐，向行结束位置对齐，向行中间位置对齐。
后两个中，space-between ：元素会平均地分布在行里。如果最左边的剩余空间是负数，或该行只有一个子元素，则该值等效于’flex-start’。在其它情况下，第一个元素的边界与行的主起始位置的边界对齐，同时最后一个元素的边界与行的主结束位置的边距对齐，而剩余的伸缩盒项目则平均分布，并确保两两之间的空白空间相等。大白话就是会把第一个元素的位置与行起始位置对其，最后一个元素与行结束位置对其，中间的剩余空间平均分布。
space-around：弹性盒子元素会平均地分布在行里，两端保留子元素与子元素之间间距大小的一半。如果最左边的剩余空间是负数，或该行只有一个伸缩盒项目，则该值等效于’center’。在其它情况下，伸缩盒项目则平均分布，并确保两两之间的空白空间相等，同时第一个元素前的空间以及最后一个元素后的空间为其他空白空间的一半。
说到这其实都是废话，这些都是flex布局初始学习就会接触到的。主要是这个面试官又问，如果中间不是2x，是x呢，也就是每个间隙与两侧的间隔相同。也就是这样：
这个问题我一开始想的是两侧设置padding，中间用justify-content: space-between;可是这样在不同的屏幕上看到的两侧padding值肯定是不同的，所以中间的间隙与两侧就不想等了。。。所以最后我也没想出来。回来之后发现justify-content居然还有space-evenly这么个属性！这个属性干嘛用的不言而喻。均匀排列每个元素，每个元素之间的间隔相等。上题就解决了。但是space-evenly的兼容性比起常用的justify-content值来说还是要差不少。
我们不能只满足与解决一道面试题，再实际情况下可能会有很多奇葩的情况，比如说上图4个x改成3个x，一个2x（虽然我是从来没见过这种奇葩的设计。。）那又该怎么办呢？
这里我想到了css3的cacl()，这玩意儿百分比，px值混搭都能计算，强的一批。比如实现上面的要求：
也一样可以达到效果。（假设a的值为100px）而且不管是什么情况都可以计算出你想要的大小，简直不要太爽。
flex如何让内容平行？
给flex里面的左右两个文字装载器设置属性为顶部对其，则就让文字内容平行。
flex布局如何移动div的位置？
用css控制例如 <style type=”text/css”> div{ width:auto; height:auto; top:auto; left:auto; right:auto; bottom:100px; } </style>
flex3插件怎么用？
1. ▼ Cydia 搜索「Flex3」，我们可以在boss源中找到「Flex 3 Beta」，iOS 12用户直接安装 「Flex3」版本。
或者我们也可以添加作者官方源：http://getdelta.co来直接获取「Flex3」版本
2. 点击「确认」安装，安装完毕再点击「重启SpringBoard」。
3， 打开flex3 我们可以看见3个页面，这分别是
我的补丁：你所有的已添加补丁
云端补丁：flex3云端补丁库
仪表盘：插件信息，版本更新，个人账户等
4， 打开云端补丁我们又可以看见有5个子页面
· Installed：本机安装的App
· New：最新
· Trending：流行
· Popular：热门
· Search：搜索
在这里我们可以随心所欲下载自己需要和感兴趣的补丁。需要注意的是要关注APP的版本号，太旧的可能就失效了。而且免费账户每天只能下载2个补丁
5,如果你不想在官方下载补丁的话也可以直接使用别人分享和收集的补丁合集。
flex调整上下间距？
1、选中所有文字，然后点击鼠标右键，选择【字体】或者按下快捷键Ctrl+D会出现一个窗口；
2、选择【字符间距】选项，在【为字体调整字间距】中输入数字即可。
flex怎么让项目左右边距一样？
用margin定义即可；比如说
.div1{width:100px;height:100px;margin:10px;}
.div2{width:100px;height:100px;margin:10px;}
…
上下左右的间距都为10px；当然如果是内间距这要这样写
.div1{width:80px;height:80px;padding:10px;}
.div2{width:80px;height:80px;padding:10px;}
…
flex布局框架？
布局思路是这样的：
1、首先给header和footer一个固定的高度。
2、然后记得body的高度要设为100%，不然body是没有高度的。
3、body的布局设为flex，然后。
4、设置好了header和footer之后，我们就可以开始设计main部分的内容排列，因为body设置的排列是column，就是纵向排列，所以不能用align-items撑开main，只能在main里面设置flex: 1 1 auto将元素撑大，而且aside和article是有滚动条的：所以在main里面要设置隐藏浮动，不然会将屏幕撑到很大。
5、上面也可以看到main也是flex布局，所以aside和article成行排列，要使article撑满宽度，也要设置flex: 1 1 auto。最后再完善每块里面的细节布局。
