Package Exports

musubii

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (musubii) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

MUSUBii

Site

https://musubii.qranoko.jp

About

「腹が減ってはコードが書けぬ」

Web デザインの腹ごなしに、HTML/CSS フレームワーク「MUSUBii（むすびー）」をどうぞ。MUSUBii は、日本語サイトのデザイン・コーディングを元気づけます。

OOCSS を応用したラフな設計
日本語フォントの利用を想定
JavaScript 未使用

Detail

Markup

要素 .(xxxx) 1 つに対して、状態 .is-(xxxx) を複数追加してスタイリングするのが基本です。また、すべてのクラス名は英小文字・数字・ハイフン 1 つで構成されています。

Layers

CSS のレイヤーは主に 4 つに分類されています。

Base … リセット CSS などの下地
Layout … 余白・マージン・グリッドシステム
Module … ボタン・テキスト・リスト・見出しなど
Utility … 調整用モディファイア

RWD

5 つの画面サイズで可変できるレスポンシブウェブデザインになっています。

Mobile … ~ 575px
Fablet … 576px ~ 767px
Tablet … 768px ~ 991px
Desktop … 992px ~ 1199px
Wide … 1200px ~

Use

Download

ファイルをダウンロード後、CSS ファイル musubii.min.css を読み込んでお使いください。

<link rel="stylesheet" href="css/musubii.min.css" />

CDN

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/musubii@6.6.0/docs/css/musubii.min.css"
/>

npm

npm install musubii

Support

日本で多く使われているブラウザを基準にバグフィックスを行なっています。

Chrome	Firefox	IE	Ege	Safari(Mac)
Newest	Newest	11~	Newest	Newest

Safari(iOS)	Chrome(Android)	Browser(Android)
Newest	Newest	4.4~

License

Credit

Author: Qrac
Organization: QRANOKO