CSS (Cascading Style Sheet) को लिखने का सही तरीका क्या है ?

CSS का इस्तमाल हम website की सुंदरता बढ़ाने के लिए करते है। लेकिन लोग कभी कभी CSS को सही से नहीं लिखते और फिर Elements कही पर भी आ जाते है। 

कुछ लोग सही Css तो लिखते है लेकिन कई बार वो चीजों बहुत Repeat करते है। जैसे Display Flex, यह property हम ज्यादातर Elements पर लिखते है। लेकिन इससे Code बड़ा हो जाता है और उसे पढ़ना भी मुश्किल होता है।

मैने Css को कम से कम और अच्छे से लिखने के तरीके नीचे बताए है।

1. Utility Classes बनाए। 

Utility Classes वो classes होती है जिन्हे हम बार बार इस्तमाल करते है। जैसे Display Flex तो करते ही है। 

इसमें हम बस एक बार ही display flex लिखते है और जब चाहे किसी भी element पर इसकी class लगाके उसे Flex container बना सकते है।

मतलब अभी तक, हमे जिस भी element को Flex Container बनाना होता था, हम उस element के नाम या class पर जाकर display flex लिखते थे। और यही चीज हम सभी elements के साथ बार बार करते है जिससे यह Repeat होने लगता है।

इसलिए अगर हम बस एक ही बार display flex लिखे किसी एक class में तो हम बस उस class के नाम को element में लिखकर उसे flex container बना सकते है।

इसी तरह justify content, align items, margin-auto, इन सब को अलग अलग classes में एक बार लिखेंगे और जब चाहे इन्हे कई बार किसी भी element पे लगा सकते है। इसी Utility Classes कहते है। अक्सर हम इसके लिए एक और Css file अलग से बनाते है और main css file अलग रखते है।

2. Units को सही जगह इस्तमाल करें। 

हम 2px, 4rem, 50vw, 50vh, जैसे units को इस्तमाल करते है। लेकिन कई लोगो इनमे अंतर नहीं पता होता। जिस कारण उनकी css सही से काम नही करती।

जैसे हमे pixel unit को Responsiv website बनाते समय इस्तमाल नही करना चाहिए क्योंकि हर device के हिसाब से pixel का size अच्छे से नहीं आता।

3. हमेशा शुरवात में इसे लिखे। 

* { margin: 0px; padding: 0px; }  

इससे जो Extra Margin Padding होती है वो हट जाती है, फिर हम किसी भी element को अच्छे से margin, padding दे सकते है

तो इस तरह आप css को अच्छे से लिख सकते है।

इस Post को पढ़ने के लिए आपका धन्यवाद :)