UIkit Flex - フロントエンドフレームワークUIkitにFlex機能が追加
- Tuesday, February 24 2015 @ 08:21 PM JST
- 投稿者: Admin
- 表示回数 5,863
フロントエンドフレームワークの[tag:UIkit]がまた機能アップ。Flexレイアウトが充実しました。2015/2/20が最新。
http://getuikit.com/docs/flex.html
class="uk-flex"で左寄せ
class="uk-flex uk-flext-right" で右寄せ
class="uk-flex uk-flext-enter" でセンタリング
縦方向も、 uk-flex-top uk-flex-middle uk-flex-bottomで揃えられます。
左寄せ
Box
Box
Box
センタリング
Box
Box
Box
右寄せ
Box
Box
Box
縦上合わせ
Box
Box
Box
縦センタリング
Box
Box
Box
縦下あわせ
Box
Box
Box
UIkitは、LESS Sass対応。class名やJavascript関数に前置子がつくため、他所から配布されるものとコンフリクトを起こさず安心して利用できるのがメリット。コンパクトな記述で多様な表現が可能です。