CSSフレームワークUIkitの使い方、レイアウト編
設定は変更可能なので必要に応じてカスタマイズしておきましょう。 グリッドの使い方、作り方 個別のカラムの前に全体を囲む.containerを作ります。センタリングする場合は.uk-container-centerも入れておきます。 <div class="uk-container uk-container-center"> </div> また、カラムを作る場合は.uk-gridで囲むようにします。Bootstrapでは.rowでしたね。 <div class="uk-grid"> </div> Bootstrapの場合は.col-md-4のように書きましたがUIkitでは以下のようになります。各カラムをuk-gridクラスを付けたdivで囲み、カラムにはグリッドの分子と分母を指定すればOK。分母は1,2,3,4,5,6,10が使えるようです。 <div class="uk-grid"> <
UIkit3の使い方 - インストールからレイアウトまで | SOLUTION MAGAZINE
はじめに 軽量のCSSフレームワークとして有名なUIkitですが、その新バージョンであるUIkit3(2017-06-19時点でbeta25)も比較的安定していると感じましたので、別案件で使ってみました。 今回の「つくってみた」では、そのインストール方法からレイアウトの方法を中心に、UIkit3の使い方をご紹介いたします。 また、ReactやVueといったリアクティブなjsフレームワークとの親和性が高く、UIkit3のサイト自体がVueで作られていています。 ただ、jQueryが必須となっていますので、そこは妥協が必要かもしれません。 2019.03.13 追記 beta31からjQueryは必要なくなりました。 現在(2019.03.13)は3.0.3が公開されており、off-canvasのhtml構造が変更されてたり、新しいコンポーネントや機能が追加されています。 ピュアなCSSフレー
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
