unitscssダウンロードunitscssソースコードのダウンロード

unitscss

サードパーティ製コンポーネント

v0.1.17

ダウンロード

ユニット

シンプルで美しいコンポーネントセット。

https://unitscss.com/

書類

英語 /日本語

特徴

ユニットはシンプルで美しいコンポーネントセットです。あなたがしなければならないのは、CSSファイルをロードし、スニペットをコピーして貼り付けることだけです。

すばやく使用してください
あなたがしなければならないのは、単にunits.cssだけを置くことだけです。いくつかのコンポーネントがすでに準備されており、使用するコンポーネントを選択してウェブサイトに適用できます。
シンプルで美しい
各コンポーネントは美しく設計されています。設計は定期的に更新され、大きな変更を適用することはありませんが、マージンの調整などの小さな変更のみを適用します。
最新のブラウザをサポートします
ユニットは、Microsoft Edge、Google Chrome、Firefox、Safariなど、最新のブラウザで使用するように最適化されています。古いブラウザはどうですか？ ... ごめんなさい。
レスポンシブWebデザイン
レスポンシブなWebデザイン承認を使用して、すべてのデバイスに最適化されたデザインを表示します。
定期的な更新
ユニットはまだベータ版であり、定期的にメジャーバージョンに更新されます。 Unitilメジャーバージョンでは、新しいコンポーネントを追加し、ソースコードを最適化し、設計を調整します。
日本人をサポートします
開発者は日本人であるため、日本語でサポートできるからです。私たちは、日本語で書かれたウェブページを最適化し、ドキュメントを更新しています。

インストール

ユニット自体は、Githubをクローン化することでGithubからダウンロードするか、zip形式としてダウンロードするか、npm経由でダウンロードできます。

$ git clone https://github.com/kokushin/unitscss.git

$ npm install unitscss --save

必要なファイルをロードしましょう。

 < link rel =" stylesheet " href =" https://fonts.googleapis.com/css?family=Roboto:400,700 " >
< link rel =" stylesheet " href =" path/to/units.min.css " >

< script src =" path/to/units.min.js " > </ script >

使用法

正確な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 >