MUSUBii Display
Display プロパティの変更 Utility を、ほぼすべてのモジュールに対して使えます。
| Add Class | .is-block | .is-inline | .is-inline-block | .is-none |
| Function | display: block; | display: inline; | display: inline-block; | display: none; |
Responsive
.is-(xxxx)-(yy) 形式の class を加えることでレスポンシブにプロパティを変化させられます。
Mobile | Fablet | Tablet | Desktop | Wide | |
|---|---|---|---|---|---|
block | .is-mobile-block | .is-fablet-block | .is-tablet-block | .is-desktop-block | .is-wide-block |
inline | .is-mobile-inline | .is-fablet-inline | .is-tablet-inline | .is-desktop-inline | .is-wide-inline |
inline-block | .is-mobile-inline-block | .is-fablet-inline-block | .is-tablet-inline-block | .is-desktop-inline-block | .is-wide-inline-block |
none | .is-mobile-none | .is-fablet-none | .is-tablet-none | .is-desktop-none | .is-wide-none |
Mobile Only | Fablet Only | Tablet Only | Desktop Only | |
|---|---|---|---|---|
block | .is-mobile-only-block | .is-fablet-only-block | .is-tablet-only-block | .is-desktop-only-block |
inline | .is-mobile-only-inline | .is-fablet-only-inline | .is-tablet-only-inline | .is-desktop-only-inline |
inline-block | .is-mobile-only-inline-block | .is-fablet-only-inline-block | .is-tablet-only-inline-block | .is-desktop-only-inline-block |
none | .is-mobile-only-none | .is-fablet-only-none | .is-tablet-only-none | .is-desktop-only-none |
Mobile ~ Fablet | Mobile ~ Tablet | Mobile ~ Desktop | |
|---|---|---|---|
block | .is-mobile-fablet-block | .is-mobile-tablet-block | .is-mobile-desktop-block |
inline | .is-mobile-fablet-inline | .is-mobile-tablet-inline | .is-mobile-desktop-inline |
inline-block | .is-mobile-fablet-inline-block | .is-mobile-tablet-inline-block | .is-mobile-desktop-inline-block |
none | .is-mobile-fablet-none | .is-mobile-tablet-none | .is-mobile-desktop-none |
Landscape | Portrait | |
|---|---|---|
block | .is-landscape-block | .is-portrait-block |
inline | .is-landscape-inline | .is-portrait-inline |
inline-block | .is-landscape-inline-block | .is-portrait-inline-block |
none | .is-landscape-none | .is-portrait-none |