सीएसएस लिखने के बेहतर भाग के लिए 5 कदम द्वितीय
यह 5 कदम के बेहतर लिखें सीएसएस के लिए दूसरा हिस्सा है. वहाँ सीएसएस ट्यूटोरियल की बहुत कुछ कर रहे हैं इंटरनेट पर उपलब्ध हैं, लेकिन कुछ ट्यूटोरियल उपयोगी होते हैं. इस ट्यूटोरियल तुम 5 कदम अपने अगले वेबसाइट परियोजना के लिए बेहतर सीएसएस कोड लिख पाएंगे. मुझे आशा है कि आप इस ट्यूटोरियल मज़ा आएगा.
1. एक पंक्ति में सीएसएस घोषणाओं रखें
तुम हमेशा एक पंक्ति में सीएसएस घोषणाओं रखना चाहिए, यह रखते हुए अपने सीएसएस स्वच्छ और छोटे फ़ाइल में मदद करता है. यह भी अवांछित रिक्त स्थान और पात्रों को दूर करता है.
अच्छा संहिता
; color : # 333333 ; background : #cccccc ; } h2 (font-size 18px:; रंग # 333333:; पृष्ठभूमि: # cccccc;)
बुरा संहिता
; color : # 333333 ; background : #cccccc ; } h2 (font-size 18px:; रंग # 333333:; पृष्ठभूमि: # cccccc;)
2. गठबंधन तत्वों
सबसे अच्छा तरीका है कोड की लाइनों को बचाने के चयनकर्ताओं के एक समूह से है. वहाँ मैं क्या बात कर रहा हूँ के नीचे कुछ उदाहरण हैं.
अच्छा संहिता
H1, h2, h3 ( ; color : # 333 ; font-परिवार: Arial, Helvetica, बिना सेरिफ़; रंग: # 333; )
बुरा संहिता
H1 ( ; color : # 333 ; font-परिवार: Arial, Helvetica, बिना सेरिफ़; रंग: # 333; ) h2 ( ; color : # 333 ; font-परिवार: Arial, Helvetica, बिना सेरिफ़; रंग: # 333; ) h3 ( ; color : # 333 ; font-परिवार: Arial, Helvetica, बिना सेरिफ़; रंग: # 333; )
3. इस्तेमाल की केंद्र पर "मार्जिन" लेआउट
सीएसएस के लिए कई शुरुआती समझ नहीं कर सकते तो आप क्यों फ्लोट: केंद्र का प्रयोग नहीं करने ब्लॉक स्तर के तत्वों पर केंद्रित है कि प्रभाव को प्राप्त कर सकते हैं. यदि केवल यह है कि आसान कर रहे थे! दुर्भाग्य से, आप का उपयोग की आवश्यकता होगी.
कोड
# कंटेनर ( ; /* top, bottom - and left, right*/ मार्जिन: 0 ऑटो; / *, ऊपर नीचे - और छोड़ दिया, सही * / चौड़ाई: xxxpx; )
4. टिप्पणी अपने सीएसएस
यह एक बहुत अच्छा विचार है वर्गों में आपके कोड टिप्पणी नहीं. एक टिप्पणी जोड़ने के लिए, बस जोड़ें / * टिप्पणी के पीछे, और * / इसे बंद करने के लिए, जैसे इतना:
कोड
/******** कोड यहाँ शुरू ********/
5. इस्तेमाल की संक्षेप सीएसएस उपकरण
अगर आप अपनी पुरानी शैली पत्रक आप बस ऑनलाइन सीएसएस उपकरण का उपयोग कर सकते हैं संशोधित संक्षेप में अपना समय बर्बाद नहीं करना चाहता, यह सेकंड में अपना काम करते हैं.
जाँच इस ऑनलाइन सीएसएस उपकरण संक्षिप्त ...
CSS साफ
साफ CSS
CSS Optimiser
Flumpcakes सीएसएस अनुकूलक
cssdrive CSS Comperasor
W3C सीएसएस Validator
निष्कर्ष
ये सुझाव है कि मुझे मदद करने के लिए बेहतर कोड लिखने के कुछ ही रहे हैं. मुझे आशा है कि ट्यूटोरियल भी आपकी मदद करेंगे बेहतर और स्वच्छ लिखने के लिए कोड. आपके वर्तमान और अगले इन परियोजनाओं के लिए युक्तियाँ लागू करें, और आप निश्चित रूप से प्रयास की सराहना करेंगे.
अगर आपको लगता है कि ट्यूटोरियल ज्यादा अच्छा होगा, कृपया हमारे साथ बाँट सकते हैं. हमें टिप्पणी
यदि आप हम से ज्यादा ट्यूटोरियल प्राप्त करना चाहते हैं, तो कृपया आरएसएस या ईमेल के द्वारा हमारे फ़ीड की सदस्यता लेने पर विचार.
को बढ़ावा देने करें
संबंधित आलेख:
यदि आप इस लेख, कृपया नीचे अन्य संबंधित वस्तुओं की जांच पढ़ मज़ा आया:
Revell पर कहते हैं: नवम्बर 27, 2009 9:05 में कहा रहा हूँ:
नमस्ते,
सबसे पहले, अच्छा लेख! वहाँ नहीं कई लेख कि सीएसएस की लेखन शैली को संबोधित कर रहे हैं. मैं पहली बात, हालांकि पर कुछ विचार है. मेरी राय यह लंबे समय लेखन शैली का इस्तेमाल बेहतर है, जबकि विकसित करने में और एक कहानी "छोटा करना" अपने सीएसएस है जब एक जीवित पर्यावरण पर इस्तेमाल करते हैं.
डेव पर कहते हैं: नवम्बर 27, 2009 10:06 में कहा रहा हूँ:
मैं पूरी तरह से 1 अंक से असहमत हैं. जब आप 3 घोषणाओं, कोड की पंक्ति 1 है महान है, लेकिन जब कोई 6 या 7 हैं, तो यह हो जाता है सच में कठिन पढ़ें.
है कि सभी 1KB शायद बचाने के लिए? मैं इसे नहीं मिला.
के अलावा है कि एक, यहाँ कुछ अच्छे विचार.
दवे की आखिरी ब्लॉग .. 2 अधिक है सीएमएस WordPress plugins को सक्षम करने के लिए चाहिए
'Nicolo Fasce पर कहते हैं: नवम्बर 27, 2009 10:34 में कहा रहा हूँ:
मैं डेव के साथ सहमत हूँ, 1 बात गलत है, सिर्फ इसलिए कि यदि आप एक टीम में काम करना बहुत एक एक पंक्ति कोड पढ़ें मुश्किल है.
तुम भी एक ही उद्देश्य के लिए वर्णमाला के क्रम में कोड लिखना चाहिए.
EJ Semeijn पर कहते हैं: नवम्बर 27, 2009 10:57 में कहा रहा हूँ:
हम इन युक्तियों पोस्टिंग क्यों बंद है? इंटरनेट इन सुझावों के मूल बातें पहले से ही भरा हुआ है. और मैं यह भी # 1 से असहमत हैं. यह आपके कोड आसानी से समझ में नहीं पड़ता, बस इसे और अधिक कठिन बना देता है.
मेरा सुझाव के लिए अपने सीएसएस में पृष्ठ संरचना रखा, रीसेट, शीर्षकों, फार्म, HTML तत्व, फ़ॉन्ट्स आदि इस तरह के लिए अपने सीएसएस वर्गों करना आसान हो जाएगा समझना होगा.
safetycopy पर कहते हैं: नवम्बर 27, 2009 9:38 में कहा:
मैं कई अन्य लोगों की टिप्पणी से सहमत हूँ - बुरा कोड की है 1 उदाहरण के बिंदु नहीं बुरा कोड है - यह सिर्फ एक वैकल्पिक तरीका है. इस पोस्ट में ही newbies पूरा उपयोगी होगा और हम उन्हें बुरा मान्यताओं पहले से ही शिक्षण शुरू नहीं करना चाहता!
है safetycopy फोटो .. पिछले ब्लॉग
जोश पर कहते हैं: नवम्बर 29, 2009 4:38 में कहा रहा हूँ:
मैं पिछले एक को छोड़कर इन सभी करते हैं. मैं इसे उपयोगी अपने सीएसएस संक्षेप में पता नहीं है, लेकिन पिछले पाठकों मैं जोरदार # 1 बिंदु पर सहमत हैं सभी के विपरीत. मैं सिर्फ एक पंक्ति में मेरी सीएसएस लेखन शुरू कर दिया गया है और यह काफी है. स्क्रॉल तक कम कर दिया गया है. मुझे लगता है कि यह एक निजी पसंद है. कुछ है कि मदद करता है कि मैं संपादक का उपयोग करें कोड wraps अगली पंक्ति के नीचे तो कोई क्षैतिज स्क्रॉल है.
जोश है पिछले ब्लॉग .. Flickr के आदी
FAQPAL पर कहते हैं: नवम्बर 29, 2009 4:06 में कहा:
अच्छी शुरुआत सुझाव, मैं अपने सीएसएस छोटा करना नहीं है या तो, शायद एक बहुत बड़ा प्रोजेक्ट minifying से लाभ होगा, लेकिन औसत साइट वास्तव में जरूरत नहीं है.
के रूप में के रूप में # 1 तक जाता है, मुझे लगता है कि शब्दों है कि लोग क्या दे रहा है दूर, बजाय कहा, "बुरी कोड", शायद यह safetycopy तरह कहना चाहिए का सुझाव दिया गया है, "वैकल्पिक कोड".
है FAQPAL पिछले ब्लॉग .. सीएसएस के साथ Bubble प्रभाव
favSHARE पर कहते हैं: नवम्बर 30, 2009 12:49 में कहा रहा हूँ:
इस लेख favSHARE.net पर साझा किया गया है. जाओ और वोट!
है favSHARE पिछले ब्लॉग .. 25 वेब लेआउट Tutorials
जीन पैट्रिक स्मिथ पर कहते हैं: दिसम्बर 11, 2009 11:15 में कहा रहा हूँ:
मैं आमतौर पर एक PHP फ़ाइल है कि मेरी सारी सीएसएस फ़ाइलें शामिल हैं बनाने के लिए, यह minifies, और संपीड़न कहते + समाप्त हो हेडर.
इस तरह मैं # 1 बात से सहमत नहीं है ...
क्या एक पंक्ति पर आपके सभी सीएसएस होने से ज्यादा महत्वपूर्ण है HTTP की संख्या कम सीएसएस sprites के साथ फोन और एक फाइल में आपके सभी सीएसएस / जे एस संयोजन.