Reset Stile Browser

UnoCSS non fornisce reset di stile o preflight per impostazione predefinita per non popolare il tuo CSS globale e anche per massima flessibilità. Se usi UnoCSS insieme ad altri framework CSS, probabilmente già fanno il reset per te. Se usi UnoCSS da solo, puoi usare librerie di reset come Normalize.css.

Forniamo anche una piccola collezione per te per prenderli rapidamente:

Installazione

pnpm

pnpm add @unocss/reset

yarn

yarn add @unocss/reset

npm

npm install @unocss/reset

bun

bun add @unocss/reset

Utilizzo

Puoi aggiungere uno dei seguenti fogli di stile reset al tuo main.js.

Normalize.css

Fonte: https://github.com/csstools/normalize.css

import '@unocss/reset/normalize.css'

sanitize.css

Fonte: https://github.com/csstools/sanitize.css

import '@unocss/reset/sanitize/sanitize.css'
import '@unocss/reset/sanitize/assets.css'

Eric Meyer

Fonte: https://meyerweb.com/eric/tools/css/reset/index.html

import '@unocss/reset/eric-meyer.css'

Tailwind

import '@unocss/reset/tailwind.css'

Tailwind compat

import '@unocss/reset/tailwind-compat.css'

Questo reset è basato sul Reset Tailwind, meno l'override del colore di sfondo per i pulsanti per evitare conflitti con i framework UI. Vedi issue collegata.

Prima

button,
[type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

Dopo

button,
[type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button; /* 1 */
  /*background-color: transparent; !* 2 *!*/
  background-image: none; /* 2 */
}