rem から px へのプリセット

ユーティリティ用に rem を px に変換します (@unocss/preset-rem-to-px)。

Rem から px へのプリセット

すべてのユーティリティに対して rem を px に変換します。

インストール

::: code-group

pnpm

pnpm add -D @unocss/preset-rem-to-px

yarn

yarn add -D @unocss/preset-rem-to-px

npm

npm install -D @unocss/preset-rem-to-px

bun

bun add -D @unocss/preset-rem-to-px

:::

uno.config.ts

import presetRemToPx from '@unocss/preset-rem-to-px'
import { defineConfig } from 'unocss'

export default defineConfig({
  presets: [
    presetRemToPx(),
    // ...other presets
  ],
})

使用法

<div class="m-2"></div>

::: code-group

Without

.m-2 {
  margin: 0.5rem;
}

With

.m-2 {
  margin: 8px;
}

:::

オプション

baseFontSize

タイプ: number
デフォルト: 16

rem を px に変換するための基本フォントサイズ (1rem = n px)。

※このページは Nuxt.js 公式ドキュメントの翻訳ページです。

公式ドキュメントの該当ページはこちら：
#