学习Flexbox的18个卓越资源

What is this "flexbox" everyone’s talking about? What problems can flexbox help solve? Can you use flexbox in your projects today? These guides, tutorials, websites, and tools will teach you what you need to know about flexbox.

1. Learn CSS Layout: Flexbox — A brief overview of the flexible box layout model.
2. Solved by Flexbox — A showcase of how flexbox can address some common layout design patterns that are a pain to implement with the traditional CSS box layout model.
3. Can I use… Flexbox — 94.57% of browsers in use¹ today are capable of rendering flexbox layouts, according to this resource.
4. Flexbox in the Real World — Strategies and tools for implementing flexbox today.
5. A Complete Guide to Flexbox — A thorough guide with lots of visuals over at CSS-Tricks.
6. Flexbox Codrops CSS Reference — A detailed reference guide that contains plenty of live demos.
7. What The Flexbox?! — A free video course, sent to your email.
8. flexbox in 5 minutes — An interactive tour of the main flexbox features and CSS properties.
9. Using CSS flexible boxes — "Many designers will find the flexbox model easier to use," according to this Mozilla Developer Network web developer guide .
10. CSS Flexible Box Layout Module Level 1 — The latest W3C technical specs of flexbox.
11. Flexbox — Fast Track to Layout Nirvana? — An intro to flexbox at Dev.Opera.
12. The Ultimate Flexbox Cheat Sheet — How to use flexbox on some popular layout design patterns.
13. Flexbox Adventures — An interactive guide to flexbox CSS properties.
14. Building With Flexbox — Examples of using flexbox to solve common layout problems.
15. Flexplorer — Learn how flexbox CSS properties affect the page layout with this interactive tool.
16. Flexy Boxes — An interactive playground for exploring flexbox.
17. CSS Flexbox Please! — An interactive demo that you can use for testing and experimentation.
18. CSS Flexbox — A collection of flexbox articles, tips, and resources.