2012-12-10 29 views
12

यह मेरी पहली बार एक वेब प्रोजेक्ट के लिए ज़र्ब फाउंडेशन का उपयोग कर रहा है। हालांकि, मुझे यकीन नहीं है कि अलग-अलग स्टाइलशीट पर अपनी शैलियों को ओवरराइड करना है या सीधे foundation.css संपादित करना है या नहीं। (नीचे एक style.css डालज़र्ब फाउंडेशन बेस सीएसएस शैलियों को संपादित करने के लिए कैसे ओवरराइड करें?

.nav-bar { 
    background: #4D4D4D; 
    height: 40px; 
    margin-left: 0; 
    margin-top: 20px; 
    padding: 0; 
} 

मैं मैं सीधे foundation.css से .nav-bar को संपादित करने या अपने ही स्टाइलशीट बना सकता हूँ background और margin-top बदलना चाहते हैं,:

उदाहरण के लिए यह उनके एनएवी सीएसएस (foundation.css अंदर) है foundation.css) और यह बहुत की तरह ओवरराइड:

.nav-bar { 
    background: #999; 
    margin-top: 0; 
} 

इस अच्छा अभ्यास है? यदि नहीं, तो इसके बारे में जाने का सबसे अच्छा तरीका क्या होगा?

उत्तर

21

सर्वोत्तम अभ्यास आपके द्वारा वर्णित कस्टम। सीएसएस फ़ाइल का उपयोग करके अपनी स्टाइल शीट को ओवरराइड करना है। इस तरह यदि कोई अपडेट जारी किया गया है, तो उदाहरण के लिए एक बग फिक्स, तो आप केवल foundation.css फ़ाइल को प्रतिस्थापित करें।

यदि आप सीधे net.css फ़ाइल संपादित करते हैं और ढांचे को अपडेट करना चाहते हैं, तो आपको मैन्युअल रूप से अपडेट स्वयं करने की आवश्यकता होगी।

+1

मैं इससे सहमत हूं। यह विशेष रूप से सच भी है यदि आप कस्टम सीएसएस संस्करण (सास/कम्पास संस्करण नहीं) डाउनलोड करते हैं क्योंकि यह आपको नींव के विभिन्न संशोधनों का उपयोग करने की अनुमति देगा क्योंकि आप सुविधाओं को जोड़ते/हटाते हैं या इस्तेमाल किए गए मूल रंगों को बदलते हैं। – JAMESSTONEco

9

सर्वोत्तम अभ्यास दस्तावेज ज़र्ब फाउंडेशन वेबसाइट पर पढ़ने के लिए है। दूसरा सबसे अच्छा अभ्यास आपके डाउनलोड के भीतर 2 फ़ोल्डर्स खोलना है: सीएसएस और जेएस। इस के भीतर फ़ोल्डर आप पाएँगे:

app.css और app.js

इन फ़ाइलों Zurb आप के लिए पहले से तैयार है, तो आप उनकी शैली अधिभावी शुरू कर सकते हैं कर रहे हैं!

नींव.जेएस या नींव.css को छूने की अनुशंसा नहीं की जाती है। आप भविष्य के विकल्पों के लिए अपग्रेड नहीं कर पाएंगे या आप ब्रेक करना नहीं चाहते हैं तो कुछ तोड़ सकते हैं। हैप्पी कोडिंग!

+0

या यदि आप सैस का उपयोग कर रहे हैं, ** app.scss ** – visyoual

1

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

ज़र्ब दस्तावेज कहता है "नींव.css, एक सीएसएस फ़ाइल है जिसका उपयोग आप अपने पृष्ठों में कर सकते हैं यदि आपको वास्तविक अंतर्निहित फाउंडेशन सीएसएस को अलग करने की आवश्यकता नहीं है।"

1

वास्तव में फाउंडेशन (या किसी भी बड़े ढांचे) पर शैलियों को ओवरराइड करने का सबसे अच्छा तरीका उनके SASS और/या कम्पास संस्करण का उपयोग करना है। (या उन दुर्भाग्यपूर्ण लोगों के लिए कम जो बूटस्ट्रैप को स्टाइल करने की कोशिश कर रहे हैं)

सुनिश्चित करने के लिए हजारों लाइनों के सीएसएस कोड के माध्यम से रंग, ऊंचाइयों और ब्रेकपॉइंट्स को बदलने के लिए _settings.scss फ़ाइल के माध्यम से जाना बहुत आसान है। आपने जिस चीज की आवश्यकता है उसे ओवरराइड कर दिया है।

हां यह सब कुछ स्थापित करने के लिए एक सीखने की वक्र है, लेकिन यह आपको लंबे समय तक घंटे बचाएगा।