【前端小知识】使弹性盒内部的div元素居中

不管多么简单的问题，总会有人遇到，总会有人不知道如何处理！

而我，就是那个给出处理办法的小朋友！

知识无高低大小之分，只要把自己获得的经验分享出去，那便是一种成功了！

或许这个分享帮不到前端大牛，但是可以给前端小白提供思路！

或许有些人说这么简单的东西，还需要分享出来吗？这不是骗流量吗？

不好意思，再简单的东西，那都是经验，你知道却不分享出来，那么请问你有什么资格去评判别人呢？

步入正题，如何让一个弹性盒子内的div元素居中

下面给大家两张图作为示例：
大家可以看到这里的示例一共由三个div组成

最外层是橙色div，橙色div内部包含了：左边蓝色div、右边绿色div

可以看到他们都是现在对齐顶部的，而我们的效果是想让他们垂直居中

那要怎么做呢？

下面这两个css属性就可以帮到你：

display: flex;
align-items: center;

在最外层橙色div的style里同时写上这两个属性就可以让内部的div元素垂直居中

实现的效果如下：

这个就是我们想要的效果了，今天的内容也接近了尾声

还是那句话，不管知识高低，只要分享出来，那你就已经成功了
希望大家可以多多分享自己的经验
有时候你可能觉得很简单的东西，在初学者看来还是比较困难的
你只要分享出来了，他们遇到相同的问题，看到你发的帖子后肯定会很快地解决！
这难道不是一种成就感吗？

感谢所有愿意分享自己知识的大佬们，你们分享的不是知识，而是财富！
同时也希望各位有学习到一些东西的话，帮他们点一个赞，这也是对他们的肯定和鼓励！
这样才会促使所有人分享自己的知识和经验，你也会从中得到很大一笔财富！