拒绝烂大街——Flexbox布局演示站了解一下

前言

最近学到Flexbox布局，当时就感受真是一个布局的神器。终于摆脱了利用各类定位浮动布局的日子。想写文章总结一下吧，发现介绍Flexbox布局类的文章都被写烂了，各类大神写的也是生动形象，单单写一个布局用法感受除了本身记录方便本地查并无什么意义，因而就想到了以前在一个视频中看到了这样的网站，可是那个网址我当时打不开就产生了本身也写一个的想法。既能本身巩固还能给初学者使用。

Flexbox演示站

大概就是张这个样子：

1. 点击设置Flex容器和Flex项目的各个属性的值以及项目的宽度，右边实时看到效果初学时更容易理解各个属性的做用。
2. 友好的提示：初学者不易记全全部的属性和值的左右，鼠标放在属性名上便可显示相应属性的做用。

查看Flexbox演示站

只是简单了写了几个响应式CSS，移动端看的效果可能不是太好，建议PC端食用

GitHub地址

最后

放上几个我学Flexbox布局时看的博客：
阮一峰——Flex 布局教程：语法篇
阮一峰——Flex 布局教程：实例篇
经过动图形象地为你介绍 flexbox 是如何工做的（一）

最后的最后，厚颜无耻求Star（逃）
若是刚好你正在学Flexbox，这个小网站对你有那么一点儿帮助给我点一个Star吧