पूरे HTML दस्तावेज़ में वैश्विक फ़ॉन्ट कैसे लागू करें

175

मेरे पास एक HTML पृष्ठ है जिसमें कुछ पाठ और प्रारूपण शामिल हैं। मैं इसे एक ही फ़ॉन्ट-परिवार और एक ही पाठ-आकार बनाना चाहता हूं जो पाठ के सभी आंतरिक स्वरूपण को अनदेखा करता है।

मैं HTML पेज के लिए एक वैश्विक फ़ॉन्ट प्रारूप सेट करना चाहता हूं।

इसे कैसे प्राप्त किया जा सकता है?

html css font-family

— माशूक़
स्रोत

263

आपको !importantCSS के भीतर तारांकन और तत्वों का उपयोग करने में सक्षम होना चाहिए ।

html *
{
   font-size: 1em !important;
   color: #000 !important;
   font-family: Arial !important;
}

तारांकन सब कुछ से मेल खाता है (आप शायद बिना htmlभी दूर हो सकते हैं)।

यह !importantसुनिश्चित करता है कि आप इस शैली में जो कुछ भी सेट कर सकते हैं उसे ओवरराइड नहीं कर सकते (जब तक कि यह महत्वपूर्ण भी न हो)। (यह आपकी आवश्यकता के साथ मदद करने के लिए है कि इसे "पाठ के आंतरिक स्वरूपण को अनदेखा करना चाहिए" - जिसका मुझे मतलब था कि अन्य शैलियों को इन पर अधिलेखित नहीं किया जा सकता है)

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

— Amadiere
स्रोत

24

+1 !importantउपयोगी है, लेकिन अगर इसका अत्यधिक उपयोग हो जाता है, तो यह थोड़ा "थार राक्षस हो सकता है"।

— स्टुपरयूजर

2

का एक महान उपयोग प्रदान करने के लिए +1 !important। इसे हमेशा अंतिम विकल्प के रूप में उपयोग किया जाना चाहिए।

— dShringi

3

ध्यान दें कि !importantयहां का उपयोग मूल पोस्टर की आवश्यकता के कारण है, "एक ही फ़ॉन्ट-परिवार और एक ही पाठ-आकार में पाठ के सभी आंतरिक स्वरूपण की अनदेखी है।" यदि आपके पास वह आवश्यकता नहीं है, तो आप उपयोग नहीं करना चाहते हैं !important।

— सेठ

1

का उपयोग करें html * {}या शामिल स्टाइल शीट में body * {}अधिक विशिष्ट के माध्यम से ओवरराइड से बचने में आपकी सहायता करेगा body p {}। body p {}की तुलना में अधिक विशिष्ट है body {}, इसलिए तारांकन यहां एक महत्वपूर्ण तत्व है।

— योयो

1

मुझे लगता है कि आप छोड़ सकते हैं htmlसे html *यहाँ

— JonnyRaa

44

सबसे अच्छा अभ्यास मुझे लगता है कि शरीर को फ़ॉन्ट सेट करना है:

body {
    font: normal 10px Verdana, Arial, sans-serif;
}

और यदि आप इसे कुछ तत्व के लिए बदलने का निर्णय लेते हैं तो इसे आसानी से अधिलेखित किया जा सकता है:

h2, h3 {
    font-size: 14px;
}

— Teneff
स्रोत

यदि आप नींव सीएसएस की तरह एक फ्रेमवर्क का उपयोग कर रहे हैं तो यह जोड़ने के बिना काम नहीं करता है!

— पेट्रोस Kyriakou

16

इसे अपने सीएसएस के बॉडी सेलेक्टर में सेट करें। उदाहरण के लिए

body {
    font: 16px Arial, sans-serif;
}

— Petecoop
स्रोत

1

यह अधिक विशिष्ट चयनकर्ताओं के साथ ओवरराइड किया जा सकता है।

— स्टुपरयूजर

2

यह सभी तत्व पर लागू नहीं होगा, उदाहरण के लिए: इनपुट प्रकार = 'बटन'

— RRTW

12

निम्नलिखित सीएसएस का उपयोग करें:

* {
    font: Verdana, Arial, 'sans-serif' !important;/* <-- fonts */
}

*-Selector का मतलब है किसी भी / सभी तत्वों, लेकिन स्पष्ट रूप से खाद्य श्रृंखला के तल पर होगा जब इसे और अधिक अधिभावी की बात आती विशिष्ट चयनकर्ताओं।

ध्यान दें कि !important-flag -स्टाइल को निरपेक्ष होने के fontलिए प्रस्तुत करेगा *, भले ही अन्य चयनकर्ताओं का उपयोग पाठ सेट करने के लिए किया गया हो (उदाहरण के लिए, bodyया शायद a p)।

— karllindmark
स्रोत

1

शायद !importantअन्य चयनकर्ताओं को सेटिंग को ओवरराइड करने से रोकेंगे।

— क्वासडंक

1

खैर, हाँ, !importantअन्य चयनकर्ताओं को ओवरराइड करने से रोकेंगे, जब तक वे इसका उपयोग नहीं करते हैं। हे। मैं अपनी पोस्ट संपादित करूंगा और इसे जोड़ूंगा - धन्यवाद। :-)

— कार्लिंडमार्क

हां, यह सही है। बहुत निश्चित नहीं है, लेकिन मुझे लगता है कि वरीयता इस बात पर भी निर्भर करती है कि आप घोषणा कहां करते हैं। यदि आप इसे बहुत नीचे रखते हैं, तो मैं !importantऊपर के अधिक विशिष्ट चयनकर्ताओं से भी ओवरराइड कर सकता हूं । लेकिन यह काफी हद तक यहाँ नहीं है मुझे लगता है :)

— क्वासडंक

यह एकमात्र उत्तर है जो वास्तव में मेरे लिए काम करता है। यकीन नहीं क्यों, लेकिन यह किया था।

— पीटर गॉर्डन

5

आपको कभी भी उपयोग नहीं करना चाहिए * + !important। यदि आप अपने HTML डॉक्यूमेंट में कुछ हिस्सों में फ़ॉन्ट बदलना चाहते हैं तो क्या होगा? आपको हमेशा महत्वपूर्ण के बिना शरीर का उपयोग करना चाहिए। !importantकेवल तभी उपयोग करें जब कोई अन्य विकल्प न हो।

— Rakowu
स्रोत

1

इसे इस्तेमाल करे:

body
{
    font-family:your font;
    font-size:your value;
    font-weight:your value;
}

— anglimasS
स्रोत

हाय एग्रीमलैस, मैंने आपका कोड फॉर्मेट कर दिया है, यदि आप 4 स्पेस या {}बटन का उपयोग करते हैं तो आप अपने उत्तरों में इस तरह से उदाहरण कोड प्रदर्शित कर सकते हैं।

— स्टुपरयूजर