सीएसएस - सामान्य वर्ग

Question

मेरे वेब ऐप में मैं कम कोड लिखने के लिए कई सीएसएस वर्गों का उपयोग करता हूं। मैं कुछ मामलों में एकल संपत्ति या दो जोड़ने के लिए मार्कअप में अक्सर उनका उपयोग करता हूं।

इनमें निम्नलिखित

.clear { float: none; clear: both; } 
.fl_l{ float: left; } 
.fl_r{ float: right; } 
.ta_l{ text-align: left; } 
.ta_r{ text-align: right; } 
.no_td:hover { text-decoration: none; } 

समान वर्गों क्या आप प्रयोग करते हैं कर रहे हैं? क्या आपने कभी इस तकनीक को अन्य परियोजनाओं में देखा है?

Answer 1

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

कुछ अन्य सामान्य वर्गों ...

.split { float: left; width: 50%; } 
.center { text-align: center: margin: auto; display: block; } 
.bold { font-weight: bold; } 
.top { vertical-align: top; } 
.bottom { vertical-align: bottom; } 

Answer 2

पुनर्स्थापित एक फ़्लोटिंग तत्व के बाद प्रवाह:

.clearfix:after 
{ 
    clear:both; 
    content:"."; 
    display:block; 
    height:0; 
    line-height:0; 
    visibility:hidden; 
} 

Answer 3

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

आप सही मायने में जानने कैसे पेशेवर सीएसएस चौखटे तो इसकी शायद लायक बनते हैं में रुचि रखते हैं अपने को डाउनलोड करते समय और समीक्षा करने के बाद:

960 grid css framework

Blueprint css framework

Answer 4

मैं से दूर रहना चाहते आप सामान्य वर्ग के नाम के रूप में क्या वर्णन करते हैं, जितना संभव हो उतना स्टाइल से संबंधित जानकारी HTML से दूर रखते हैं। शिकारी द्वारा वर्णित अनुसार, इसका मतलब यह है कि चयनकर्ता सूचियां कभी-कभी लंबी हो सकती हैं, लेकिन मुझे यह कोई समस्या नहीं मिलती है।

यदि मैं फ्लोट को साफ़ करने के लिए एक सामान्य श्रेणी का नाम उपयोग करना चाहता था (केवल उदाहरणों में से केवल एक उदाहरण है), तो मैं अक्सर कुछ समूह का उपयोग नहीं करने की अपेक्षा करता हूं - समूह समूह - कम से कम कुछ समूह है उससे जुड़ी अर्थशास्त्री की थोड़ी मात्रा (चीजों का एक समूह जो संभवतः एक साथ हैं)। यह दान Cederholm द्वारा सुझाव दिया गया था।

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

Answer 5

ऐसे पुराने प्रश्न पर उत्तर पोस्ट करने के लिए खेद है, लेकिन मुझे लगता है कि यह एक बुरा विचार है। शायद समस्याओं के एक विशिष्ट सेट के लिए, यह बिल फिट बैठता है। मेरी सोच यह है कि सीएसएस वह जगह है जहां शैली की जानकारी होनी चाहिए। जो भी आप सुझाव देते हैं, वही कर रहे हैं, आप अनिवार्य रूप से केवल HTML में शैली विशेषता का उपयोग कर रहे हैं और इसलिए सामग्री w/शैली की जानकारी मिश्रित कर रहे हैं। यह एक बुरा विचार है क्योंकि यदि एक दिन आप शैली को पूरी तरह से बदलने का फैसला करते हैं, तो आपको कक्षाओं में से अधिकांश को हटाकर HTML में अपडेट करना होगा और अपडेट करना होगा।

उदाहरण के लिए, यदि आप HTML इस तरह है (एक सार है कि पृष्ठ के भीतर कई बार प्रयोग किया जाता है के लिए कहते हैं):

<p class="abstract ta_l mb10"> 
    Lorem ipsum dolor set. 
</p> 

और एक दिन आप कैसे है कि सार लग रहा है बदलने का फैसला: उदाहरण के लिए, आप नहीं चाहते हैं कि यह "टेक्स्ट-गठबंधन: बाएं" और अब कोई मार्जिन तल न हो (यह संभवतः एमबी 10 क्या होगा ... मैंने इसे पहले इस्तेमाल किया है), आपको HTML में जाना होगा और बदलना होगा ।

अब इसे बदलने के लिए 10 तत्वों से गुणा करें। क्या होगा अगर यह 50 था? क्या होगा यदि आप एक पूर्ण रीडिज़ाइन कर रहे थे? shudder।

सीएसएस एक सरल क्वेरी के साथ कई तत्वों का चयन करने का एक तरीका प्रदान करता है और उन्हें उपयुक्त शैली प्रदान करता है जो आसानी से केंद्रीकृत स्थान से बदला जाता है। इन "सहायक" वर्गों का उपयोग करके, आप इस परियोजना के रखरखाव को अगले डेवलपर के लिए एक दुःस्वप्न बना रहे हैं।

इसके बजाय, अगर आप इस तरह की है HTML:

<p class="abstract"> 
    You should sign in or something! 
</p> 

और इस तरह सीएसएस:

.abstract { 
    margin-bottom: 10px; 
    text-align: left; 
} 

तुम सिर्फ बदल सकता है कि यह करने के लिए एक नियम:

.abstract { 
    text-align: right; 
    margin-bottom: 0; 
} 

और w/इसे किया जाना चाहिए! सभी 50 तत्वों के लिए!

बस मेरे 2 सेंट - किसी से जो इसे अभी जला दिया गया है।