2012-01-04 12 views
291

क्या एकाधिक कक्षाओं को एक HTML कंटेनर में असाइन करना संभव है?एक HTML कंटेनर में एकाधिक कक्षाएं कैसे असाइन करें?

कुछ की तरह:

<article class="column, wrapper"> 
+0

अब आपके पास क्या समस्या है? किसी भी तरह से इस समस्या का समाधान था। कोई अन्य समस्या कई कारकों पर निर्भर हो सकती है। –

+0

हालांकि यह करने योग्य है, मैं आमतौर पर सीएसएस विरासत के साथ नेस्टेड कंटेनर का उपयोग करता हूं। यह बहुत सुंदर है, और आमतौर पर अधिक उपयोगी है। –

+0

यदि आपको अभी भी अल्पविराम को हटाने के बाद कोई समस्या है तो मैं सुझाव देता हूं कि [नियम क्यों काम नहीं करते] [https://developer.mozilla.org/en-US/docs/Web/CSS/Common_CSS_Questions # Style_rules_that_don.27t_work)। मुझे लगता है कि मेरे लिए सबसे आम गति-टक्कर मिली है "वहां एक शॉर्टेंड पॉपर्टी का उपयोग" (यानी, एक निश्चित मूल्य पर वापस आना) –

उत्तर

394

बस इस तरह अल्पविराम निकालें:

<article class="column wrapper"> 
+0

<लेख वर्ग = "कक्षा 1 कक्षा 2 ... कक्षाएन"> –

145

मानक

7.5.2 तत्व पहचानकर्ता से: आईडी और वर्ग का श्रेय

विशेषता परिभाषा

आईडी = नाम [सीएस]
यह विशेषता किसी तत्व को एक नाम असाइन करती है। यह नाम किसी दस्तावेज़ में अद्वितीय होना चाहिए।

वर्ग = सीडीटा-सूची [सीएस]
यह विशेषता कक्षा के नाम या किसी तत्व के वर्ग नामों को सेट करती है। तत्वों के किसी भी संख्या को समान श्रेणी का नाम या नाम असाइन किया जा सकता है। एकाधिक वर्ग नामों को सफेद स्थान वर्णों से अलग किया जाना चाहिए।

हां, बस उनके बीच एक जगह डालें।

<article class="column wrapper"> 

बेशक, सीएसएस विरासत के साथ आप कई चीजें कर सकते हैं। इसे गूगल पर देखें।

+3

किसी तत्व को एकाधिक वर्गों को असाइन किया गया है जो एक ही विशेषता के लिए अलग-अलग मान सेट करते हैं, तो ब्राउज़र को प्रतिक्रिया करने की अपेक्षा कैसे की जानी चाहिए। क्या इसके लिए प्राथमिकता का कुछ आदेश है? – EternallyCurious

+0

@EternallyCurious विशेषताएँ ब्राउज़र द्वारा एकत्रित की जाती हैं, इसलिए यह व्यवहार गैर-निर्धारक होगा। –

+5

@ जोनाथन हेन्सन: नहीं, यह नहीं है।बंधे विशिष्टता के मामले में, सीएसएस में बाद में जो नियम होता है वह जीतता है। –

8

एक HTML तत्व को कई वर्गों सौंपने के लिए, वर्ग विशेषता के उद्धरणों के अंदर दोनों वर्ग के नाम शामिल हैं और उन्हें एक जगह से अलग कर दिया गया है:

<article class="column wrapper"> 

उपरोक्त उदाहरण में, column और wrapper दो अलग-अलग सीएसएस वर्ग हैं, और उनकी दोनों संपत्ति article तत्व पर लागू की जाएगी।

+11

क्या यह उत्तर पिछले से अलग है? –

1

हाँ, कोई अल्पविराम नहीं। बस एक जगह क्योंकि ऐसा लगता है कि अल्पविराम प्रथम श्रेणी, कॉलम का हिस्सा है। फिर यह कक्षा column, बनाता है जो काम नहीं करता है। वर्किंग कोड इस तरह दिखता है: <article class="column wrapper">

+1

स्पष्टीकरण – btl

+0

स्पष्टीकरण के साथ एक कामकाजी उदाहरण शामिल करें! पहला जवाब, मुझे नहीं पता था कि मुझे ऐसा करना था। – ProfitPhoenix

संबंधित मुद्दे