स्क्रैच से सीएसएस टेम्पलेट कैसे बनाएं

Question

मैं अपनी कल्पना का एक सीएसएस टेम्पलेट बनाना चाहता हूं: इसका मतलब SCRATCH से है।

मैं ऐसा करना चाहता हूं जैसे कि मैं इसे पेन के साथ कर रहा हूं, लेकिन बस माउस के साथ। मुझे इस क्षेत्र (सीएसएस) के बारे में कोई जानकारी नहीं है, इसलिए मैं पूछ रहा हूं। कई डेवलपर्स ने चट्टानों के शानदार टेम्पलेट्स बनाए थे।

मैं जानना चाहता हूं कि आप अपने सीएसएस टेम्पलेट्स कैसे बनाते हैं? (यदि आपने किया) क्या आप किसी एप्लिकेशन का उपयोग करके ढांचे का उपयोग करके उन्हें स्क्रैच से शुरू करते हैं? क्या यह कठिन या आसान है?

बस आप इसे कैसे करते हैं?

Answer 1

सब कुछ और जो भी आप कभी भी सीएसएस के बारे में जानना चाहते थे, a list apart पर पाया जा सकता है। आपको css garden भी पसंद हो सकता है। महान, वास्तविक दुनिया के उदाहरण आप अलग-अलग चुन सकते हैं और हैक कर सकते हैं।

Answer 2

आप CSS पर पढ़ना चाहेंगे।

Answer 3

मैं खरोंच से मेरा शुरू, बस वी.एस. या Aptana आदि का उपयोग कर इसे टाइप

मैं मूल लेआउट बाहर काम करते हैं, उदाहरण के लिए 3 स्तंभ के लिए।

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

यहां से मैंने सीएसएस को बाहरी फाइल में रखा और मेरे तत्वों को जोड़ने शुरू कर दिया, जैसा कि मैं जाता हूं।

इससे पहले कि आप इसे जानते हों, आपको कुछ मीठा लग रहा होगा, यह आश्चर्यजनक रूप से तेज़ होता है!

Answer 4

* 
{ 
    margin: 0; 
    padding: 0; 
    border: 0; 
    border-collapse: collapse; 
} 

क्यू कल्पना

Answer 5

मत पहिया फिर से आविष्कार, एक अच्छा स्थापित सीएसएस आधार खोजने के लिए और उस पर निर्माण।

Answer 6

कार्रवाई की मेरी ठेठ पाठ्यक्रम:

1. लागू करें एक CSS reset
2. एक layout template
3. खोजें एक color scheme
4. खोजें ???
5. लाभ!

Answer 7

मैं तुम्हें जा इस फिर से उपयोग करने के लिए है, क्योंकि आप इसे एक टेम्पलेट बुलाया गया है जा रहे हैं मान है, तो मुझे यकीन है कि आप एक तार्किक ढंग से/समूह अपने सीएसएस तत्वों (पाठ, लेआउट को व्यवस्थित बनाने चाहते हैं आदि)। आप कुछ ऐसा चाहते हैं जिसे आप जल्दी से पढ़ और अनुकूलित कर सकें।

निश्चित रूप से स्पष्ट डिफ़ॉल्ट मार्जिन और paddings, क्योंकि विभिन्न ब्राउज़रों (खांसी आईई) क्या मार्जिन और paddings विभिन्न तत्वों होना चाहिए का अपना विचार है।

अंत में, प्रतिशत और ईएमएस का उपयोग करें। यह आपके डुप्लिकेशन को काफी कम कर देगा। उदाहरण के लिए...

body { font-size: 12px }; 
.wrapper { width: 800px; } 

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

h1 { font-size: 2em; } 
.content { font-size: 1.2em; } 
.sidebar { font-size: 1em; } 

.content { width: 70%; } 
.sidebar { width: 30%; } 

आप तय 800px वर्ष टोपी है, तो आप 900px करने के लिए अपने एक चौड़ाई को बदल सकते हैं, और सब कुछ अभी भी काम करेगा।

Answer 8

यह पूरी तरह से स्थिति पर निर्भर करता है। अगर मुझे किसी मौजूदा पृष्ठ के लिए टेम्पलेट बनाना है जो सीएसएस का उपयोग कर रहा है, अक्सर एक संपादक या कुछ द्वारा उत्पन्न होता है, तो मैं इसे एक शुरुआती बिंदु के रूप में उपयोग करता हूं और जब तक मैं चाहता हूं तब तक बिट्स और टुकड़ों को बदलता हूं। यह WordPress और उस तरह के ऐप्स के लिए भी जाएगा।

जब मेरे पास शुरू करने के लिए कोई सीएसएस नहीं है, तो मैं 'बॉडी' से काम करता हूं और बच्चों के बच्चों के बच्चों के लिए अपना रास्ता नीचे काम करता हूं। बड़े से छोटे तक।

मुझे ऐसे टूल का उपयोग करना पसंद है जो सीएसएस टैग का दृश्य प्रस्तुतिकरण दिखाता है, इसलिए मैं देख सकता हूं कि यह कैसा दिखता है। मुझे Expression Web पसंद है क्योंकि यह शैलियों को बहुत आसान पर नेविगेट कर सकता है और मुझे दिखाता है कि यह कैसा दिखता है।

Answer 9

आपने अपनी टिप्पणी में this reply पर कहा है कि आप इसे आसानी से ट्विक करने में सक्षम होना चाहते हैं?

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