インストール手順
UNITSは簡単に設置でき、すぐに使用することができます!
1. UNITSはGitHubからのクローンまたはZIP形式でダウンロードするか、npmからダウンロードすることができます。
$ git clone https://github.com/kokushin/unitscss.git
$ npm install unitscss --save
2. 必要なファイルを読み込ませましょう。
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet">
<link rel="stylesheet" href="path/to/units.min.css">
<script src="path/to/units.min.js"></script>
3. 定められたHTMLを組み、uc-
からはじまるコンポーネントクラスを付与して下さい。例えば下記のサンプルでは、カバー画像カードのコンポーネントを適用させることができます。
<div class="uc-card _float">
<div class="uc-card-image" style="background-image:url(https://source.unsplash.com/random)"></div>
<h3 class="uc-card-title">Sample card</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aspernatur, et.</p>
<div class="uc-btn _primary"><a href="#">Button</a></div>
</div>
4. このようにブラウザに表示されます :