Aspect
アスペクト比を設定するユーティリティ CSS。
Table of Contents
Basic
.is-aspect-{ratio}
で縦横比を固定できます{ratio}
は16x9
3x2
4x3
1x1
の 4 種類
アスペクト比 | クラス名 |
---|---|
16x9 | .is-aspect-16x9 |
3x2 | .is-aspect-3x2 |
4x3 | .is-aspect-4x3 |
1x1 | .is-aspect-1x1 |
アスペクト比 16x9
<div class="box is-aspect-16x9">アスペクト比 16x9</div>
Variables
上書きできる変数は以下の通りです。
/* None */
Import
PostCSS で読み込む場合の各パスは以下となります。
@import "musubii/src/utilities/aspect/main.css";