【CSS】小型フレックスボックスレイアウトシステムBute Layout

CSS

Bute Layout

February 10, 2018

Bute Layoutは小型フレックスボックスレイアウトシステム。

Introduction

クラス属性を設定する代わりに、data-container,data-grid, data-cell, data-offset, data-order, data-align, data-visibilityなどのデータ属性が使用されます

<div data-container>
  <div data-grid>
    <div data-cell="xs-4 lg-3" data-align="bottom"></div>
    <div data-cell="xs-4 lg-3" data-offset="lg-3"></div>
    <div data-cell="xs-4 lg-3" data-order="md-first" data-visibility="xs-hide"></div>
  </div>
</div>

Installation

<link href="https://cdn.jsdelivr.net/npm/butelayout/dist/butelayout.css" rel="stylesheet">

Latest Posts

Related Posts