ब्राउज़र स्टाइल रीसेट

UnoCSS डिफ़ॉल्ट रूप से स्टाइल रीसेटिंग या प्रीफ्लाइट प्रदान नहीं करता है ताकि आपके ग्लोबल CSS को पॉप्युलेट न करें और अधिकतम लचीलेपन के लिए भी। यदि आप UnoCSS का उपयोग अन्य CSS फ्रेमवर्क के साथ करते हैं, तो वे शायद पहले से ही आपके लिए रीसेटिंग कर रहे होंगे। यदि आप अकेले UnoCSS का उपयोग करते हैं, तो आप Normalize.css जैसी रीसेटिंग लाइब्रेरी का उपयोग कर सकते हैं।

हम आपके लिए उन्हें जल्दी से प्राप्त करने के लिए एक छोटा संग्रह भी प्रदान करते हैं:

इंस्टॉलेशन

pnpm

pnpm add @unocss/reset

yarn

yarn add @unocss/reset

npm

npm install @unocss/reset

bun

bun add @unocss/reset

उपयोग

आप निम्नलिखित रीसेट स्टाइलशीट में से एक को अपने main.js में जोड़ सकते हैं।

Normalize.css

स्रोत: https://github.com/csstools/normalize.css

import '@unocss/reset/normalize.css'

sanitize.css

स्रोत: https://github.com/csstools/sanitize.css

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

Eric Meyer

स्रोत: 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'

यह रीसेट Tailwind रीसेट पर आधारित है, UI फ्रेमवर्क के साथ संघर्ष से बचने के लिए बटन के लिए बैकग्राउंड कलर ओवरराइड को घटाकर। लिंक्ड समस्या देखें।

पहले

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

बाद में

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