2010-10-15 9 views
86

जब मैं फ़ॉन्ट परिवार, फ़ॉन्ट आकार, रंग इत्यादि सेट करता हूं तो ऐसा लगता है कि कुछ नेस्टेड तत्व इन बदसूरत ब्राउज़र डिफ़ॉल्ट के साथ ओवरराइड करते हैं।एचटीएमएल वेब पेज पर सभी तत्वों के लिए फ़ॉन्ट विशेषताओं को कैसे निर्दिष्ट करें?

क्या मुझे वास्तव में अपने पृष्ठ पर किसी भी प्रकार के तत्व के लिए उन दर्जनों बार निर्दिष्ट करना चाहिए, या क्या उन्हें एक बार और हमेशा के लिए वैश्विक रूप से सेट करने का कोई तरीका है?

यह कैसे करें?

+1

वास्तव में किस प्रकार आप वर्तमान में फ़ॉन्ट परिवार, आकार सेट कर रहे हैं ...? – thecoop

उत्तर

166
* { 
font-size: 100%; 
font-family: Arial; 
} 

तारांकन सभी तत्वों का तात्पर्य है।

+12

यह काम करता है, लेकिन यह सबसे अच्छा समाधान नहीं है। जब ब्राउज़र '*' को देखता है तो यह पृष्ठ में सभी HTML तत्वों पर लूप करता है और उन्हें सीएसएस लागू करता है। यहां तक ​​कि उन तत्वों के लिए जहां नियम कोई समझ नहीं लेता है। एचटीएमएल के आकार के आधार पर यह पृष्ठ प्रतिपादन को धीमा कर सकता है। –

+4

सहमत हैं, लेकिन यह सभी तत्वों के लिए सीएसएस लागू करता है, क्योंकि बगअर्ट ने पूछा था। यदि कोई सभी तत्वों को प्रभावित करना चाहता है, तो कोई प्रदर्शन को कम करने की उम्मीद कर सकता है। :) – Bazzz

+1

आप यह भी जोड़ सकते हैं कि प्रत्येक स्टाइल घोषणा के अंत में अन्य शैली घोषणाओं के खिलाफ सुरक्षित होने के लिए महत्वपूर्ण है। – Sam

1

यदि आप अपने body तत्व के लिए सीएसएस विशेषताओं को निर्दिष्ट करते हैं तो इसे <body></body> के भीतर किसी भी चीज़ पर लागू होना चाहिए जब तक कि आप स्टाइलशीट में बाद में उन्हें ओवरराइड न करें।

7

आप उन्हें बॉडी टैग

body 
{ 
    font-size:xxx; 
    font-family:yyyy; 
} 
+12

यह सटीक नहीं है क्योंकि अधिकांश ब्राउज़र इस फ़ॉन्ट को कुछ तत्वों पर लागू नहीं करेंगे (तत्व फ़ॉन्ट-शैली का वारिस नहीं करेंगे) –

+0

@ ट्रैविस-146 क्या ब्राउज़र? कौन सा तत्व? आप जानते हैं कि एक ऐसा नमूना है जिसे सभी ब्राउज़रों का पालन करना चाहिए। – Bamieh

15

में सेट आप IE उपयोग कर रहे हैं कर सकते हैं, तो संभावना यह कुछ तत्वों, तालिकाओं की तरह के लिए ब्राउज़र चूक पर लौट जाएगा रहे हैं। आपको लगता है कि मुकाबला कर सकते हैं निम्नलिखित सीएसएस की तरह कुछ के साथ:

html, body, form, fieldset, table, tr, td, img { 
    margin: 0; 
    padding: 0; 
    font: 100%/150% calibri,helvetica,sans-serif; 
} 

input, button, select, textarea, optgroup, option { 
    font-family: inherit; 
    font-size: inherit; 
    font-style: inherit; 
    font-weight: inherit; 
} 

/* rest of your styles; like: */ 
body { 
    font-size: 0.875em; 
} 

संपादित करें: आप सीएसएस फिर सेट करता है पर पढ़ने के लिए चाहते हो सकता है; देखें this one

9

मैं इस सलाह को पर्याप्त तनाव नहीं दे सकता: रीसेट स्टाइलशीट का उपयोग करें, फिर सबकुछ स्पष्ट रूप से सेट करें। यह आपके क्रॉस-ब्राउज़र सीएसएस विकास समय को आधे में काट देगा।

प्रयास करें एरिक मेयेर के reset.css.

+0

इस reset.css का उपयोग करने के लिए, क्या मैं स्टाइलशीट को अपने पृष्ठ में लिंक करता हूं या क्या मुझे इसे ट्विक करना है? मुझे मूल रूप से सभी प्रमुख ब्राउज़रों में एक ही फ़ॉन्ट परिवार और आकार की आवश्यकता होती है। क्या reset.css मुझे डिफ़ॉल्ट रूप से ऐसा करने में मदद करता है? –

+1

मैं इसे अलग-अलग जोड़ने के बजाय अपनी स्टाइलशीट की शुरुआत में कॉपी और पेस्ट करता हूं, HTTP अनुरोध सहेजता है। यह आपको ब्राउज़रों में लगातार शैलियों को सेट करने में मदद करेगा क्योंकि यह सबकुछ शून्य करता है: केवल शैलियों ही आप लिखेंगे। –

+0

धन्यवाद! मैंने कोशिश की और उसने मेरी अधिकांश समस्याओं का समाधान किया है। हालांकि, मैं अभी भी अपनी स्टाइल शीट के विनिर्देशों के बावजूद क्रोम और फ़ायरफ़ॉक्स के बीच फ़ॉन्ट आकार में अंतर देख सकता हूं। इस बारे में कोई विचार? इसके अलावा, क्या यह एक अच्छा अभ्यास है? –

संबंधित मुद्दे