search

Rplus / f2e-note

record some note in issue
0 stars 0 forks source link

about flex #16

Open Rplus opened 9 years ago

Rplus commented 9 years ago

W3C draft CSS Flexible Box Layout Module Level 1 http://dev.w3.org/csswg/css-flexbox/

Rplus commented 9 years ago

A Visual Guide to CSS3 Flexbox Properties https://scotch.io/tutorials/a-visual-guide-to-css3-flexbox-properties

by Dimitar Stojanov at April 13, 2015

圖解 flexbox

[簡中] 图解CSS3 Flexbox属性 http://www.w3cplus.com/css3/a-visual-guide-to-css3-flexbox-properties.html

W3Cplus 譯文版本

Rplus commented 9 years ago

CSS Flexible Box Layout Module http://css.doyoe.com/properties/flex/index.htm

[簡中] flexbox 屬性查表介紹：新伸缩盒属性

Rplus commented 9 years ago

A Complete Guide to Flexbox https://css-tricks.com/snippets/css/a-guide-to-flexbox/

[簡中] 一个完整的Flexbox指南 http://www.w3cplus.com/css3/a-guide-to-flexbox.html

Rplus commented 9 years ago

Using CSS flexible boxes https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexible_boxes

MDN

[簡中] 使用 CSS 弹性盒 https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Flexible_boxes#toc

Rplus commented 9 years ago

Flexbox | Codrops CSS Reference http://tympanus.net/codrops/css_reference/flexbox/

圖文並茂的 Codrops reference

Rplus commented 8 years ago

透過步進式的(青蛙)遊戲關卡 介紹 flexbox 使用時機 http://flexboxfroggy.com/

Rplus commented 8 years ago

FlexBox Cheatsheet PDF version: http://jonibologna.com/content/images/flexboxsheet.pdf

via: http://jonibologna.com/flexbox-cheatsheet/

Rplus commented 8 years ago

CSS Flexbox Frequently updated collection of hand-picked articles and learning resources. http://heydesigner.com/css-flexbox/

收集 CSS flex 各種優良資源的網站

※ https://www.facebook.com/rplus.tw/posts/911604408907343

Rplus commented 8 years ago

Flexbox playgroung http://codepen.io/enxaneta/full/adLPwv/

使用點選的方式測試 flexbox 的對齊方向

Rplus commented 8 years ago

Flexbox Playground https://demos.scotch.io/visual-guide-to-css3-flexbox-flexbox-playground/demos/

控制項較多，可測項目較全面 image

Rplus commented 8 years ago

CSS Flexbox Please! http://demo.agektmr.com/flexbox/

有最小/最大寬度設定，較貼進實際使用狀況

image

Rplus commented 8 years ago

The Flexbox Reading List: Techniques and Tools By Cosima Mielke, February 23rd, 2016 https://www.smashingmagazine.com/2016/02/the-flexbox-reading-list/

大補帖文章！ 全讀完肯定爆強 Orz

Rplus commented 7 years ago

详解 flex-grow 与 flex-shrink https://github.com/xieranmaya/blog/issues/9

Rplus commented 7 years ago

Solved by Flexbox

Cleaner, hack-free CSS https://philipwalton.github.io/solved-by-flexbox/

紮實的 Flexbox~ <3