Translation Not Available
This page has not been translated yet. You are viewing the Japanese version.
Spacer
スペースを確保するためのモジュールです。
構造
div.a--spacer[aria-hidden="true"]Props
| プロパティ | 説明 |
|---|---|
w | widthの値 |
h | heightの値 |
<Space>では、wとhに対してSPACEトークンの値が使えます。
Import
import { Spacer } from 'lism-css/react';Usage
↓
<Spacer>の使用例Content…
Content…
リサイズ可能
<p>Content...</p><Spacer h="100px" /><p>Content...</p> ↓
SPACEトークンを使う例Box
Box
リサイズ可能
<p>Box</p><Spacer h='60' /><p>Box</p> ↓
横方向のスペーサーの例
Box
Box
Box
リサイズ可能
<Flex g='10'> <Box p='20' bd>Box</Box> <Spacer w='40' /> <Box p='20' bd>Box</Box> <Box p='20' bd>Box</Box></Flex>