CSS नकली तत्वों के साथ क्यों काम करता है?


438

अपनी कक्षा में, मैं इधर-उधर खेल रहा था और पता चला कि सीएसएस निर्मित तत्वों के साथ काम करता है।

उदाहरण:

imsocool {
    color:blue;
}
<imsocool>HELLO</imsocool>

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

मेरे प्रोफेसर मुझे बने हुए तत्वों का उपयोग क्यों नहीं करना चाहते? वे प्रभावी ढंग से काम करते हैं।

इसके अलावा, उसे यह क्यों नहीं पता था कि निर्मित तत्व मौजूद हैं और CSS के साथ काम करते हैं। क्या वे असामान्य हैं?


62
HTML डेटा को अर्थ प्रदान करने का एक तरीका है जिसे विभिन्न प्रकार के माध्यमों (लोगों और ब्राउज़रों सहित) द्वारा समझा जा सकता है। आपके बनाए टैग कोई अर्थ नहीं जोड़ते हैं। यह कई कारणों में से एक है कि वह क्यों नहीं चाहता कि आप उनका उपयोग करें।
punkrockbuddyholly

59
@Mristerister वास्तव में मुझे लगता है कि वे करते हैं। क्या अधिक सार्थक है - <p>555-212-2344</p>या <supportPhone> 555-212-2344 </ supportPhone>
यूरी

169
@YuriyGalanter <p class = "supportPhone">; P
punkrockbuddyholly

30
@MrMisterMan बस याद रखें, ये सभी नियम और प्रोग्रामिंग निर्माण लोगों द्वारा किए गए थे, जो आपसे ज्यादा स्मार्ट नहीं हैं, और आप इसे बदल सकते हैं, आप इसे प्रभावित कर सकते हैं, आप अपनी खुद की चीजों का निर्माण कर सकते हैं जो अन्य लोग उपयोग कर सकते हैं।
L_7337

90
मैं इंगित कर सकता हूं कि आप जो कर रहे हैं वह मूल रूप से XML नहीं HTML है। XML एक अधिक अमूर्त मार्कअप भाषा है जो आपको "उपयोगी" तरीके से डेटा का प्रतिनिधित्व करने की अनुमति देती है - जिसका आप वर्णन करते हैं। अर्थ के साथ संलग्न है। आप HTML में अपने डेटा को रेंडर करने के लिए एक XSLT परिवर्तन का उपयोग कर सकते हैं
ose

जवाबों:


470

CSS नकली तत्वों के साथ क्यों काम करता है?

(अधिकांश) ब्राउज़रों को HTML में भविष्य के परिवर्धन के साथ संगत (कुछ हद तक) डिज़ाइन किया गया है। गैर-मान्यता प्राप्त तत्वों को DOM में पार्स किया गया है, लेकिन उनके पास कोई शब्दार्थ या विशिष्ट डिफ़ॉल्ट रेंडरिंग नहीं है।

जब विनिर्देश में एक नया तत्व जोड़ा जाता है, तो कभी-कभी CSS, जावास्क्रिप्ट और ARIA का उपयोग पुराने ब्राउज़रों में समान कार्यक्षमता प्रदान करने के लिए किया जा सकता है (और उन भाषाओं को जोड़ने के लिए उन भाषाओं को जोड़ने में सक्षम होने के लिए तत्वों को DOM में प्रकट होना पड़ता है। )।

(हालांकि यह ध्यान दिया जाना चाहिए कि कस्टम तत्वों के साथ HTML का विस्तार करने के लिए एक साधन को परिभाषित करने के लिए काम चल रहा है , लेकिन यह काम वर्तमान में विकास के शुरुआती चरणों में है, इसलिए इसे शायद तब तक बचा जाना चाहिए जब तक कि यह परिपक्व न हो जाए।)

मेरे प्रोफेसर मुझे बने हुए तत्वों का उपयोग क्यों नहीं करना चाहते?

  • उन्हें HTML विनिर्देश द्वारा अनुमति नहीं है
  • वे एक ही नाम के साथ भविष्य के मानक तत्वों के साथ संघर्ष कर सकते हैं
  • संभवतः मौजूदा HTML तत्व है जो कार्य के लिए बेहतर है

इसके अलावा, उसे पता नहीं था कि मेकअप के तत्व मौजूद थे और CSS के साथ काम किया। क्या वे असामान्य हैं?

हाँ। उपरोक्त समस्याओं के कारण लोग उनका उपयोग नहीं करते हैं।


30
"उन्हें HTML विनिर्देश द्वारा अनुमति नहीं है" जरूरी नहीं कि यह सच हो। वे एचटीएमएल नेमस्पेस स्पेसिफिकेशन के अनुरूप नहीं हैं, लेकिन एचटीएमएल 5 कल्पना एक बहुत व्यापक चीज है जो कस्टम विनिर्देशों के लिए अनुमति देती है, और स्पष्ट रूप से बताती है कि सीएसएस और एपीआई हैंडलिंग (डीओएम) के संबंध में ऐसी चीजों को कैसे संभालना है।
बेन लैश

4
पहले से ही पुस्तकालय हैं, सबसे विशेष रूप से Angular.js, जो आपको कस्टम तत्वों के साथ HTML का विस्तार करने की अनुमति देते हैं। शायद इस अर्थ में नहीं कि आपका मतलब है कि तत्वों को केवल जावास्क्रिप्ट द्वारा पार्स किया जाता है और आमतौर पर वास्तविक लोगों के लिए अनुवादित किया जाता है, लेकिन अगर आप html को कस्टम टैग के साथ विस्तारित करना चाहते हैं, तो आप इसे
चार्ली मार्टिन के

11
+1 के लिए "वे भविष्य के मानकों के साथ संघर्ष कर सकते हैं"। याद रखें कि यह अब काम कर सकता है लेकिन इसे शुरू करने के बाद आपको 3-4 साल तक काम करना होगा।
टिम.बैकर

70
मुझे शैली प्रदर्शन लागू करने के बजाय डोम तत्वों को छिपाने के लिए एक <निंजा> टैग पसंद है: कोई नहीं जैसे: <निंजा> कुछ छिपा सामान </ निंजा>
kiranvj

18
एक और वास्तव में महत्वपूर्ण बिंदु: नेत्रहीन लोगों या विशेष रूप से सीमित क्षमता वाले लोगों के लिए विशेष ब्राउज़र विभिन्न चीजों के लिए उचित HTML तत्वों का उपयोग करते हैं (उदाहरण के लिए हेडर का अनुसरण करके पृष्ठ पर नेविगेशन आसानी से)। इसलिए लापता शब्दार्थ + डिफ़ॉल्ट रेंडरिंग सामान्य ब्राउज़र को बहुत अधिक प्रभावित नहीं कर सकता है, लेकिन ये विशेष ब्राउज़र संभवतः आपकी वेब साइट की उपयोगिता को कम करने, भ्रमित हो जाएंगे।
सिस्तेद अर

98

टी एल; डॉ

  • कस्टम टैग HTML में अमान्य हैं। यह मुद्दों को प्रस्तुत करने के लिए नेतृत्व कर सकते हैं।
  • भविष्य के विकास को अधिक कठिन बनाता है क्योंकि कोड पोर्टेबल नहीं है।
  • Valid HTML SEO, गति और व्यावसायिकता जैसे बहुत सारे लाभ प्रदान करती है।

लंबा जवाब

हैं कुछ तर्क है कि कस्टम टैग के साथ कोड अधिक उपयोगी है।

हालाँकि, यह अमान्य HTML की ओर जाता है। जो आपकी साइट के लिए अच्छा नहीं है।

मान्य सीएसएस / HTML का बिंदु | स्टैक ओवरफ़्लो

  • Google इसे पसंद करता है इसलिए यह SEO के लिए अच्छा है।
  • यह आपके वेब पेज को आपके द्वारा परीक्षण नहीं किए गए ब्राउज़रों में काम करने की अधिक संभावना बनाता है।
  • यह आपको अधिक पेशेवर दिखता है (कम से कम कुछ डेवलपर्स के लिए)
  • आज्ञाकारी ब्राउज़र रेंडर कर सकता है [वैध HTML तेज]
  • यह उन अस्पष्ट बगों की ओर इशारा करता है जो आपने शायद याद कर लिए हैं जो उन चीजों को प्रभावित करते हैं जिनका आपने शायद परीक्षण नहीं किया है जैसे पेज के कोडपेज या भाषा सेट।

क्यों मान्य | W3C

  • डिबगिंग टूल के रूप में मान्यता
  • भविष्य-प्रूफ गुणवत्ता की जाँच के रूप में मान्यता
  • सत्यापन रखरखाव को आसान बनाता है
  • मान्यता अच्छी प्रथाओं को सिखाने में मदद करती है
  • मान्यता व्यावसायिकता की निशानी है

8
मान्य कोड के लिए एक और तर्क है, यदि आपको किसी अन्य डेवलपर को सौंपने की आवश्यकता है या आप एक टीम में काम कर रहे हैं, तो अन्य सदस्यों या नए डेवलपर को तुरंत समझना चाहिए कि आप क्या हासिल करने की कोशिश कर रहे हैं। । । अमान्य, बनाए गए टैग के साथ, यह बहुत मुश्किल हो सकता है ...
पैट डॉबसन

9
उर्फ। भविष्य के विकास और आसान रखरखाव।
दान ग्रन्ह

68

YADA (अभी तक एक और (अलग) उत्तर)

संपादित करें: टाइप बनाम टैग बनाम तत्व के बारे में नीचे दिए गए बोल्टकॉक से टिप्पणी देखें। मैं आमतौर पर शब्दार्थ के बारे में चिंता नहीं करता, लेकिन उनकी टिप्पणी बहुत उपयुक्त और सूचनात्मक है।

यद्यपि पहले से ही अच्छे उत्तरों का एक गुच्छा है, आपने संकेत दिया कि आपके प्रोफेसर ने आपको इस प्रश्न को पोस्ट करने के लिए प्रेरित किया है, इसलिए ऐसा प्रतीत होता है कि आप स्कूल में (औपचारिक रूप से) हैं । मैंने सोचा कि मैं न केवल सीएसएस बल्कि वेब ब्राउज़र के यांत्रिकी के बारे में गहराई से थोड़ा और विस्तार करूंगा । विकिपीडिया के अनुसार , "CSS एक स्टाइल शीट भाषा है जिसका उपयोग वर्णन करने के लिए किया जाता है ... मार्कअप भाषा में लिखा गया एक दस्तावेज़ ।" (मैंने "ए" पर जोर दिया) ध्यान दें कि यह "एचटीएमएल में लिखा" नहीं है एचटीएमएल का एक विशिष्ट संस्करण। CSS का उपयोग HTML, XHTML, XML, SGML, XAML इत्यादि पर किया जा सकता है, बेशक, आपको कुछ ऐसा चाहिए जो रेंडर करेइनमें से प्रत्येक दस्तावेज़ प्रकार जो स्टाइल भी लागू करेगा। परिभाषा के अनुसार, CSS विशिष्ट मार्कअप भाषा टैग के बारे में नहीं जानता / समझता / समझता नहीं है । इसलिए, जहां तक ​​HTML का संबंध है, टैग "अमान्य" हो सकते हैं, लेकिन CSS में "वैध" टैग / तत्व / प्रकार की कोई अवधारणा नहीं है।

आधुनिक विज़ुअल ब्राउज़र अखंड कार्यक्रम नहीं हैं। वे विभिन्न "इंजन" का एक समामेलन हैं जो करने के लिए विशिष्ट कार्य हैं। एक नंगे न्यूनतम पर मैं 3 इंजन, रेंडरिंग इंजन, CSS इंजन और जावास्क्रिप्ट इंजन / VM के बारे में सोच सकता हूं। सुनिश्चित नहीं है कि यदि पार्सर रेंडरिंग इंजन (या इसके विपरीत) का हिस्सा है या यदि यह एक अलग इंजन है, लेकिन आपको यह विचार मिलता है।

दृश्य ब्राउज़र है या नहीं ( दूसरों ने पहले से ही इस तथ्य को संबोधित किया है कि स्क्रीन पाठकों के पास अवैध टैग से निपटने में अन्य चुनौतियां हो सकती हैं ) प्रारूपण लागू होता है यह निर्भर करता है कि क्या पार्सर दस्तावेज़ में "अमान्य" टैग छोड़ता है और फिर क्या रेंडरिंग इंजन शैलियों को लागू करता है उस टैग के लिए। चूंकि इसे विकसित करना / बनाए रखना अधिक कठिन होता है, इसलिए सीएसएस इंजनों को यह समझने के लिए नहीं लिखा जाता है कि "यह एक HTML दस्तावेज़ है इसलिए यहां मान्य टैग / तत्वों / प्रकारों की सूची दी गई है।" CSS इंजन केवल टैग / तत्व / प्रकार ढूंढते हैं और फिर रेंडरिंग इंजन को बताते हैं, "यहां वे शैलियाँ हैं जिन्हें आपको लागू करना चाहिए।" रेंडरिंग इंजन वास्तव में शैलियों को लागू करने का फैसला करता है या नहीं, यह है।

यहां इंजन से इंजन तक बुनियादी प्रवाह के बारे में सोचने का एक आसान तरीका है : पार्सर -> सीएसएस -> प्रतिपादन। वास्तव में यह बहुत अधिक जटिल है लेकिन यह शुरुआत के लिए पर्याप्त है।

यह उत्तर पहले से ही बहुत लंबा है इसलिए मैं वहां समाप्त हो जाऊंगा।


10
यद्यपि आपने उल्लेख किया है कि "टैग" तत्वों के लिए एक सामान्य शब्द बन गया है, जिसके साथ मैं असहमत नहीं हूं और इससे असहमत हूं, यह इस तथ्य को नहीं बदलता है कि उनके लिए सही शब्द अभी भी "तत्व" है। एक टैग विशेष रूप से HTML और XML की एक सिंटैक्स सुविधा है, और अन्य दस्तावेज़ भाषाओं में मौजूद नहीं हो सकती है जो सीएसएस के साथ संगत हैं। इसलिए, यह कहना कि सीएसएस शैलियों "टैग" के रूप में लोग अक्सर कहते हैं कि वे सीएसएस के दस्तावेज़ भाषा अज्ञेयवाद के लिए बहुत सारे न्याय नहीं कर रहे हैं।
BoltClock

53

अज्ञात तत्वों को divआधुनिक ब्राउज़रों द्वारा माना जाता है। इसलिए वे काम करते हैं। यह आने वाले HTML5 मानक का एक हिस्सा है जो एक मॉड्यूलर संरचना का परिचय देता है जिसमें नए तत्व जोड़े जा सकते हैं।

पुराने ब्राउज़रों में (मुझे लगता है कि IE7-) आप एक जावास्क्रिप्ट-ट्रिक लागू कर सकते हैं जिसके बाद वे भी काम करेंगे।

यहाँ एक संबंधित प्रश्न है जो मैंने एक उदाहरण की तलाश में पाया था।

यहाँ जावास्क्रिप्ट फिक्स के बारे में एक प्रश्न है । यह वास्तव में IE7 है जो बॉक्स से बाहर इन तत्वों का समर्थन नहीं करता है।

इसके अलावा, उसे पता नहीं था कि मेकअप टैग मौजूद थे और CSS के साथ काम किया। क्या वे असामान्य हैं?

हां, काफी। लेकिन विशेष रूप से: वे अतिरिक्त उद्देश्य की सेवा नहीं करते हैं। और वे html5 के लिए नए हैं। HTML के पुराने संस्करणों में एक अज्ञात टैग अमान्य था।

इसके अलावा, शिक्षकों को कभी-कभी अपने ज्ञान में अंतराल दिखाई देता है। यह इस तथ्य के कारण हो सकता है कि उन्हें छात्रों को किसी दिए गए विषय के बारे में मूल बातें सिखाने की जरूरत है, और यह वास्तव में सभी ins और बहिष्कार को जानने और वास्तव में अद्यतित होने का भुगतान नहीं करता है। मुझे एक बार नजरबंदी मिल गई क्योंकि एक शिक्षक ने सोचा कि मैंने एक वायरस प्रोग्राम किया है, सिर्फ इसलिए कि मैं playGWBBic में कमांड का उपयोग करके कंप्यूटर प्ले संगीत बना सकता हूं। (सच्ची कहानी, और हाँ, बहुत पहले)। लेकिन जो भी कारण है, मुझे लगता है कि हिरासत तत्वों का उपयोग न करने की सलाह एक ध्वनि है।


3
@OnoSendai आपने मुझे संदेह किया है, लेकिन मुझे वास्तव में लगता है कि उन्हें 'अतिरिक्त मार्कअप के बिना ब्लॉक तत्व' के रूप में प्रदान किया गया है, इसलिए मूल रूप से डिव्स हैं।
GolezTrol

6
@OnoSendai एक ब्लॉक तत्व का प्रदर्शन संपत्ति हो सकता है ब्लॉक , लेकिन यह आवश्यक नहीं है। उदाहरण के लिए, एंकर टैग को ब्लॉक स्थिति के लिए प्रचारित किया गया (जिसका अर्थ है कि आपको उनके अंदर div जैसे ब्लॉक तत्व डालने की अनुमति है), लेकिन फिर भी इनलाइन डिस्प्ले प्रॉपर्टी है।
cimmanon

8
का प्रारंभिक मूल्य displayहै inline, इसलिए @ ओनोसेन्डाई की टिप्पणी सही है।
बोल्टलॉक

2
@ कैमिमन: aतत्वों में एक पारदर्शी सामग्री मॉडल होता है, चाहे वे ब्लॉक हों या इनलाइन इस बात पर निर्भर करते हैं कि उनका पूर्वज ब्लॉक है या इनलाइन। यह उत्तर अज्ञात तत्वों के बारे में बात कर रहा है, जिसके लिए HTML एक सामग्री मॉडल को परिभाषित नहीं करता है। जहाँ तक CSS का सवाल है, अगर कोई ब्राउज़र डिफ़ॉल्ट displayमूल्य नहीं है तो यह प्रारंभिक मूल्य का उपयोग करता है।
BoltClock

1
@ BoltClock का ananicorn तो इसका मतलब है कि <div> <a> foo </a> <a> बार </a> </ div> दो <a> टैग को ब्लॉक के रूप में प्रस्तुत करेगा? यह थोड़ा संदिग्ध लगता है ...
शराबी

27

वास्तव में आप कस्टम तत्वों का उपयोग कर सकते हैं। यहाँ इस विषय पर W3C कल्पना है:

http://w3c.github.io/webcomponents/spec/custom/

और यहां एक ट्यूटोरियल बताया गया है कि उनका उपयोग कैसे करें:

http://www.html5rocks.com/en/tutorials/webcomponents/customelements/

जैसा कि @Quentin द्वारा बताया गया है: यह विकास के शुरुआती दिनों में एक मसौदा विनिर्देश है, और यह तत्व के नाम क्या हो सकता है पर प्रतिबंध लगाता है।


7
यह ध्यान दिया जाना चाहिए कि विकास के शुरुआती दिनों में यह एक मसौदा विनिर्देश है, और यह तत्व के नाम पर प्रतिबंध लगाता है।
क्वेंटिन

2
+1 पता नहीं था कि W3C उपयोग करता है githubलेकिन वास्तव में वे उपयोग करते हैं।
वेटर कैनोवा

22

अन्य उत्तरों के बारे में कुछ बातें हैं जो या तो केवल खराब तरीके से संचालित हैं या शायद थोड़ी गलत हैं।

FALSE (ish): गैर-मानक HTML तत्व "अनुमति नहीं", "अवैध", या "अमान्य" हैं।

जरुरी नहीं। वे "गैर-अनुरूप" हैं । क्या फर्क पड़ता है? कुछ "अनुरूप नहीं" हो सकता है और अभी भी "अनुमत" हो सकता है। W3C HTML पुलिस को आपके घर भेजने और आपसे दूर जाने के लिए नहीं जा रहा है।

W3C ने इस कारण से चीजों को छोड़ दिया। अनुरूपता और विशिष्टताओं को एक समुदाय द्वारा परिभाषित किया गया है। यदि आप अधिक विशिष्ट उद्देश्यों के लिए HTML का उपभोग करने वाले एक छोटे समुदाय के होते हैं और वे सभी कुछ नए तत्वों पर सहमत होते हैं, तो उन्हें चीजों को आसान बनाने की आवश्यकता होती है, उनके पास W3C को "अन्य लागू विनिर्देशों" के रूप में संदर्भित किया जा सकता है । (यह सरलीकरण पर एक सकल है, जाहिर है, लेकिन आपको यह विचार मिलता है)

उस ने कहा, सख्त सत्यापनकर्ता आपके गैर-मानक तत्वों को "अमान्य" घोषित करेंगे। लेकिन ऐसा इसलिए है क्योंकि सत्यापनकर्ता का काम यह है कि वह जो भी कल्पना कर रहा है, उसके अनुरूप होना सुनिश्चित करे, न कि ब्राउज़र या उपयोग के लिए "वैधता" सुनिश्चित करे ।

FALSE (ish): गैर-मानक HTML तत्वों के परिणामस्वरूप मुद्दों का प्रतिपादन किया जाएगा

संभवतः, लेकिन संभावना नहीं है। ("" "के साथ" विल "को बदलें) इसका एकमात्र तरीका यह होना चाहिए कि एक रेंडरिंग मुद्दे में परिणाम हो, यदि आपका कस्टम तत्व किसी अन्य विनिर्देश के साथ विरोध करता है, जैसे कि HTML कल्पना में परिवर्तन या किसी अन्य विनिर्देश को उसी सिस्टम में सम्मानित किया जा रहा है (जैसे कि एसवीजी, गणित, या कुछ कस्टम)।

वास्तव में, CSS गैर-मानक टैग का कारण बन सकता है क्योंकि HTML विनिर्देश स्पष्ट रूप से बताता है कि:

उपयोगकर्ता एजेंटों को उन तत्वों और विशेषताओं का इलाज करना चाहिए जो वे शब्दार्थ के रूप में तटस्थ नहीं समझते हैं; उन्हें DOM (DOM प्रोसेसर के लिए) में छोड़कर, और उन्हें CSS (CSS प्रोसेसर के लिए) के अनुसार स्टाइल किया जा सकता है, लेकिन उनसे कोई मतलब नहीं निकाला जा सकता है

नोट: यदि आप एक कस्टम टैग का उपयोग करना चाहते हैं, तो बस बाद में HTML कल्पना में बदलाव को याद रखें, जिससे आपकी स्टाइल को उड़ाया जा सके, इसलिए इसे तैयार करें। यह वास्तव में संभावना नहीं है कि W3C <imsocool>टैग को लागू करेगा , हालांकि।

गैर-मानक टैग और जावास्क्रिप्ट (DOM के माध्यम से)

जावास्क्रिप्ट का उपयोग करके आप कस्टम तत्वों तक पहुंच सकते हैं और बदल सकते हैं क्योंकि विनिर्देश यहां तक ​​कि इस बारे में भी बात करता है कि उन्हें DOM में कैसे संभाला जाना चाहिए , जो कि (वास्तव में भयानक) API है जो आपको अपने पृष्ठ पर तत्वों को हेरफेर करने की अनुमति देता है।

HTMLUnognElement इंटरफ़ेस का उपयोग उन HTML तत्वों के लिए किया जाना चाहिए जो इस विनिर्देश (या अन्य लागू विनिर्देशों) द्वारा परिभाषित नहीं हैं।

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

उदाहरण के लिए:

var wee = document.createElement('wee');
console.log(wee.toString()); //[object HTMLUnknownElement]

(मुझे यकीन है कि यह लपटों को आकर्षित करेगा, लेकिन मेरे 2 सेंट हैं)


3
न केवल HTML यह निर्दिष्ट करता है कि तत्वों को wrt CSS का कैसे व्यवहार किया जाना चाहिए, सीएसएस युक्ति अधिकांश भाग के लिए है, साथ ही डिजाइन द्वारा दस्तावेज़ भाषा-अज्ञेय (यह पहले से ही थोड़े-थोड़े कुछ अन्य उत्तरों में निहित है, लेकिन मैं इसे यहां नोट करता हूं सुविधा)। वहाँ किसी भी व्यवहार है कि HTML और / या एक्सएचटीएमएल के लिए विशिष्ट है है, यह हमेशा इंगित किया जाता है , यहां तक कि जानकारी देने वाले पाठ में (उदाहरण के लिए "एक HTML एलीमेंट आईडी द्वारा निर्दिष्ट किया जाता idविशेषता") ही नहीं, प्रामाणिक पाठ (देखें पृष्ठभूमि और बॉर्डर 3 एक के लिए उदाहरण)।
BoltClock

18

चश्मा के अनुसार:

सीएसएस

एक प्रकार का चयनकर्ता एक दस्तावेज़ भाषा तत्व का नाम है जिसे सीएसएस योग्य नामों के सिंटैक्स का उपयोग करके लिखा गया है

मुझे लगा कि इसे तत्व चयनकर्ता कहा जाता है , लेकिन जाहिर है कि यह वास्तव में टाइप चयनकर्ता है। इस पर बात चल CSS qualified namesरही है कि वास्तव में नाम क्या हैं, इस पर कोई प्रतिबंध नहीं है। यह कहना है कि जब तक प्रकार चयनकर्ता सीएसएस योग्य नाम सिंटैक्स से मेल खाता है तब तक यह तकनीकी रूप से सीएसएस सही है और दस्तावेज़ में तत्व से मेल खाएगा। ऐसे तत्वों पर कोई सीएसएस-विशिष्ट प्रतिबंध नहीं है जो किसी विशेष कल्पना में मौजूद नहीं हैं - HTML या अन्यथा।

एचटीएमएल

दस्तावेज़ में किसी भी टैग को शामिल करने पर कोई आधिकारिक प्रतिबंध नहीं है जो आप चाहते हैं। हालाँकि, दस्तावेज़ कहता है

लेखकों को अपने उचित इच्छित सिमेंटिक उद्देश्य के अलावा अन्य उद्देश्यों के लिए तत्वों, विशेषताओं या विशेषता मानों का उपयोग नहीं करना चाहिए, क्योंकि ऐसा करने से सॉफ्टवेयर पेज को सही ढंग से संसाधित करने से रोकता है।

और यह बाद में कहता है

लेखकों को उन तत्वों, विशेषताओं या विशेषता मानों का उपयोग नहीं करना चाहिए जिन्हें इस विनिर्देश या अन्य लागू विनिर्देशों द्वारा अनुमति नहीं है, क्योंकि ऐसा करने से भाषा को भविष्य में विस्तारित करने के लिए काफी कठिन हो जाता है।

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

हालांकि, कस्टम तत्वों के लिए एक मसौदा है , लेकिन मुझे संदेह है कि इसे अभी तक कहीं भी लागू किया गया है।


मुझे लगता है कि हम में से अधिकांश तत्व चयनकर्ताओं के रूप में उनके बारे में सोचते हैं लेकिन यह समझ में आता है कि वे "आधिकारिक तौर पर" प्रकार के चयनकर्ता हैं।
एंड्रयू स्टिट्ज

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

@ BoltClock का ananicnic: True, but class, ID, और attribute सभी हैं, उह, विशेषताएँ (LOL) एक "एलिमेंट" की, यानी "कोरे" एंगल ब्रैकेट्स के अंदर। वे "तत्व" का वर्णन करते हैं जिसका उद्घाटन टैग वे में रहते हैं। हां, <a> और <div> तत्वों के विशिष्ट "प्रकार" हैं, लेकिन मुझे संदेह है कि कोई भी वर्ग, आईडी और विशेषताओं को "तत्व" कहेगा। मैं पूरी तरह से मानता हूं कि सभी चयनकर्ता वास्तव में "तत्व" चयनकर्ता हैं लेकिन कॉमोन उपयोग में, लोग आमतौर पर चयनकर्ताओं को "तत्व" चयनकर्ताओं के रूप में संदर्भित करते हैं। यह मेरी पिछली टिप्पणी की बात थी। क्षमा करें यह स्पष्ट नहीं था। :-)
एंड्रयू स्टिट्ज

@ExplosionPills - HTML चश्मा यह नहीं कहता है कि अज्ञात तत्व अस्वीकृत हैं, लेकिन चूंकि प्रत्येक तत्व में तत्वों के नामों की एक एनुमेरेटेड सूची है, जिसे उसके बच्चों (अर्थात इसके सामग्री मॉडल) के रूप में अनुमति दी गई है, यह करने की आवश्यकता नहीं है। एक अज्ञात तत्व की अनुमति के रूप में एक अज्ञात तत्व की अनुमति है। ऐसे तत्वों के लिए HTMLUnognElement को लागू करना पूर्व-कल्पना का हिस्सा है - अर्थात HTML उपभोक्ताओं को दस्तावेज़ों के साथ मान्य या नहीं - और लेखकों को अपने दस्तावेज़ों को वैध बनाने के लिए क्या करना चाहिए, इसका हिस्सा नहीं होना चाहिए।
अलोहसी

@ एलोची का अर्थ है कि इस अर्थ में अनुमति नहीं दी गई है कि वे डोम से खारिज कर दिए जाएंगे क्योंकि शब्दार्थिक रूप से अमान्य होने का विरोध किया गया था
धमाका गोलियां

13

यह html5 के साथ संभव है लेकिन आपको पुराने ब्राउज़रों पर ध्यान देने की आवश्यकता है।

यदि आप उनका उपयोग करने का निर्णय लेते हैं, तो अपने html को सुनिश्चित करने के लिए सुनिश्चित करें !! कुछ लोगों को यह पता लगाने में कुछ परेशानी हो सकती है कि यह एक टिप्पणी है, जिससे उन्हें एक टन की बचत हो सकती है।

कुछ इस तरह,

<!-- Custom tags in use, refer to their CSS for aid -->

जब आप अपने स्वयं के कस्टम टैग / तत्व बनाते हैं, तो पुराने ब्राउज़रों का कोई सुराग नहीं होगा कि HTML5 जैसे तत्व क्या हैं nav/ section

यदि आप इस अवधारणा में रुचि रखते हैं तो मैं इसे सही तरीके से करने की सलाह देता हूं।

शुरू करना

कस्टम तत्व वेब डेवलपर्स को नए प्रकार के HTML तत्वों को परिभाषित करने की अनुमति देते हैं। कल्पना वेब घटक की छतरी के नीचे उतरने वाले कई नए एपीआई प्राइमेट में से एक है, लेकिन यह संभवतः सबसे महत्वपूर्ण है। वेब घटक कस्टम तत्वों द्वारा अनलॉक की गई विशेषताओं के बिना मौजूद नहीं हैं:

नए HTML / DOM तत्वों को परिभाषित करें अन्य तत्वों से फैलने वाले तत्वों को बनाएं एक साथ टैग में कस्टम कार्यक्षमता को बंडल करें मौजूदा तत्वों के एपीआई बढ़ाएं

बहुत कुछ है जो आप इसके साथ कर सकते हैं और यह आपकी स्क्रिप्ट को सुंदर बनाता है क्योंकि यह लेख इसे रखना पसंद करता है। HTML में नए तत्वों को परिभाषित करने वाले कस्टम तत्व

तो पुनर्कथन देता है,

पेशेवरों

  • बहुत सुंदर और पढ़ने में आसान।

  • इतने सारे को न देखना अच्छा है divs। : p

  • कोड के लिए एक अनूठा अनुभव देता है

विपक्ष

  • पुराने ब्राउज़र समर्थन पर विचार करने के लिए एक मजबूत बात है।

  • अन्य डेवलपर्स के पास कोई सुराग नहीं हो सकता है कि यदि वे कस्टम टैग के बारे में नहीं जानते हैं तो क्या करें। (उन्हें समझाएं या उन्हें सूचित करने के लिए टिप्पणियां जोड़ें)

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

चुनाव पूरी तरह से आप पर निर्भर है और आपको इसे इस आधार पर तैयार करना चाहिए कि परियोजना क्या मांग रही है।

अद्यतन 1/2/2014

यहाँ एक बहुत ही उपयोगी लेख है जो मुझे मिला और मुझे लगा कि मैं साझा करूंगा, कस्टम तत्व

कस्टम तत्व क्यों तकनीक जानें? कस्टम तत्व लेखकों को अपने तत्वों को परिभाषित करने देते हैं। लेखक जावास्क्रिप्ट कोड को कस्टम टैग नामों के साथ जोड़ते हैं, और फिर उन कस्टम टैग नामों का उपयोग करते हैं जैसे वे कोई मानक टैग करते हैं।

उदाहरण के लिए, सुपर-बटन नामक एक विशेष प्रकार के बटन को पंजीकृत करने के बाद, सुपर बटन का उपयोग इस तरह करें:

कस्टम तत्व अभी भी तत्व हैं। हम उन्हें किसी भी मानक या आज की तरह ही आसानी से बना सकते हैं, उपयोग कर सकते हैं, उनमें हेरफेर कर सकते हैं।

यह उपयोग करने के लिए एक बहुत अच्छी लाइब्रेरी की तरह लगता है, लेकिन मैंने नोटिस किया कि यह विंडो की बिल्ड स्थिति को पारित नहीं करता है। यह एक पूर्व-अल्फ़ा में भी है जो मुझे विश्वास है कि मैं इस पर नज़र रखता हूँ जबकि यह विकसित होता है।


3
" Other developers may have no clue what to do if they don't know about custom tags." मुझे उस तर्क से नफरत है। अन्य डेवलपर्स को नया सामान सीखना चाहिए और यदि वे आपके कोड में उपयोग की जाने वाली तकनीकों को नहीं समझते हैं, तो उन्हें आपके ज्ञान में कमियों को इंगित करने के लिए आपका आभारी होना चाहिए। शायद यह इस मामले में थोड़ा अनुचित है, क्योंकि कस्टम टैग केवल एक मसौदे के रूप में मौजूद हैं, लेकिन मैंने उचित मानकीकृत तकनीकों का उपयोग करते समय एक ही तर्क सुना है।
GolezTrol

1
मैं यह नहीं कह रहा हूं कि मैं इसका समर्थन करता हूं, लेकिन बहुत सारे डेवलपर्स सीखना जारी नहीं रखते हैं। थोड़ा जटिल या नया होने पर कुछ टिप्पणी न करने का लगभग कोई कारण नहीं है। हम सभी अपनी लिपियों को सही बताते हैं? यह दिखाने के लिए कि हम क्या कर रहे हैं और कैसे, कस्टम टैग के साथ भी ऐसा ही है।
जोश पॉवेल

1
बेशक, अगर यह सिर्फ टिप्पणियों को जोड़ने के बारे में है। हालांकि मेरा मतलब था कि आपको कस्टम तत्वों का उपयोग बिल्कुल नहीं करना चाहिए क्योंकि अन्य लोग समझ नहीं पाएंगे। जब आप कम इस्तेमाल की जाने वाली तकनीक जोड़ते हैं तो एक छोटी सी टिप्पणी जोड़ना एक अच्छी बात है। HTML में टिप्पणियों से सावधान रहें, हालांकि। वे क्लाइंट पर समाप्त हो सकते हैं, बैंडविड्थ का उपभोग कर सकते हैं और संभवतः कार्यान्वयन विवरण का खुलासा कर सकते हैं जो आप अपने आगंतुकों के बारे में नहीं जानना चाहते हैं। लेकिन वैकल्पिक रूप से आप PHP / ASP टिप्पणियों के रूप में टिप्पणियां जोड़ सकते हैं, इसलिए वे अभी भी टेम्पलेट में हैं, लेकिन सर्वर पर बने रहते हैं।
GolezTrol

1
@GolezTroi, ऐसा नहीं है कि आपको कभी ऐसा काम नहीं करना चाहिए जो अन्य डेवलपर्स को चुनौती दे, यह लागत-लाभ का सवाल है। यदि अगले डेवलपर के लिए कठिन तरीके से कुछ करना कानूनी रूप से आपके कोड को बेहतर और क्लीनर बनाता है, तो इसे करें। लेकिन केवल मज़े के लिए ख़ुशख़बरी न करें।
बोस्टनजॉन

1
@JoshPowell टिप्पणियाँ क्या और कैसे होनी चाहिए (कोड पहले से ही कहता है कि, और यदि यह पर्याप्त स्पष्ट नहीं है, तो कोड को तब तक फिर से लिखें), लेकिन मुझे क्यों बताना चाहिए । टिप्पणियों के भार से कुछ चीजें खराब होती हैं, जो कहती हैं कि sendmailफ़ंक्शन मेल या ऐसा कुछ भेजता है। मुझे अधिक दिलचस्पी होगी कि आप मेल क्यों भेजते हैं - और यदि फ़ंक्शन का नाम स्पष्ट है, तो बढ़िया है! फिर मुझे एक टिप्पणी की आवश्यकता नहीं है, जो आदर्श मामला है। मैं वैसे भी कोड पढ़ लूंगा।
क्रिस्टोफर क्रुट्ज़िग

4

वह क्यों नहीं चाहता कि आप उनका उपयोग करें? वे सामान्य नहीं हैं और न ही HTML5 मानक का हिस्सा हैं। तकनीकी रूप से, उन्हें अनुमति नहीं है। वे एक हैक हैं।

मैं खुद उन्हें पसंद करता हूं, हालांकि। आपको XHTML5 में दिलचस्पी हो सकती है। यह आपको अपने स्वयं के टैग को परिभाषित करने और मानक के हिस्से के रूप में उपयोग करने की अनुमति देता है।

इसके अलावा, जैसा कि अन्य ने बताया है, वे अमान्य हैं और इस प्रकार पोर्टेबल नहीं हैं।

वह क्यों नहीं जानता था कि वे मौजूद हैं? मुझे नहीं पता, सिवाय इसके कि वे आम नहीं हैं। संभवतः वह सिर्फ इतना नहीं जानता था कि आप कर सकते हैं।


2
कोई XHTML5 नहीं है - XHTML 2 के बारे में लाने की कोशिश करने वाला एक कार्य समूह था, लेकिन यह वर्षों पहले आ गया था।
अधिकतम

1
@papirtiger: XHTML5 HTML5 एक्सएमएल की तरह काम किया जाता है, लेकिन आप सही हैं कि XHTML 1.1 से परे कोई स्वतंत्र XHTML मानक नहीं है।
BoltClock

1
तो वहाँ है XHTML5, लेकिन यह कस्टम टैग इस विषय के बारे में एचटीएमएल 5 से शायद ही अलग करने के लिए लगता है। वहाँ मुझे लगता है कि XHTML5 के बारे में कथन आपको HTML5 के विपरीत अतिरिक्त टैग को परिभाषित करने की अनुमति देता है, जो गलत है, जो कि डाउनवोट की व्याख्या कर सकता है, भले ही मैं एक्सएचटीएमएल 5 के बारे में पर्याप्त नहीं हूं या तो इस उत्तर को अपवोट या डाउनवोट कर सकता हूं।
गोलेज़ट्रॉल

1
डब्ल्यू 3 सी के एचटीएमएल 5 ड्राफ्ट के अनुसार, एचटीएमएल और एक्सएचटीएमएल (अब) "ठोस वाक्यविन्यास" उसी "अपमानजनक भाषा" का प्रतिनिधित्व करते हैं। उनके पास एक ही मौलिक विशेषताएं हैं, सिवाय इसके कि वे केवल एक वाक्यविन्यास (एक्सएमएल नामस्थान, एचटीएमएल नॉटस्क्रिप्ट
IMSoC

2

निर्मित टैग शायद ही कभी उपयोग किए जाते हैं, क्योंकि यह संभावना नहीं है कि वे हर वर्तमान ब्राउज़र और प्रत्येक भविष्य के ब्राउज़र में मज़बूती से काम करेंगे।

एक ब्राउज़र को HTML कोड को उन तत्वों में पार्स करना पड़ता है, जिन्हें वह जानता है, बने-बनाए टैग को दस्तावेज़ ऑब्जेक्ट मॉडल (DOM) में फिट करने के लिए कुछ और में परिवर्तित किया जाएगा। जैसा कि वेब मानकों को कवर नहीं करता है कि मानकों के बाहर होने वाली प्रत्येक संभाल को कैसे संभालना है, वेब ब्राउज़र विभिन्न तरीकों से गैर-स्टैंडर्स कोड को संभालते हैं।

वेब विकास अलग-अलग ब्राउज़रों के एक समूह के साथ काफी मुश्किल है, जिनके पास अपने स्वयं के quirks हैं, बिना अनिश्चितता के दूसरे तत्व को जोड़ते हुए। सबसे अच्छी शर्त यह है कि यह उन चीज़ों के साथ रहना है जो वास्तव में मानकों में हैं, यही वह है जो ब्राउज़र विक्रेता अनुसरण करने की कोशिश करते हैं, ताकि वास्तव में काम करने का सबसे अच्छा मौका हो।


2

मुझे लगता है कि आईडी के साथ पी से टैग किए गए टैग केवल संभावित रूप से अधिक भ्रमित या अस्पष्ट हैं (आमतौर पर पाठ के कुछ ब्लॉक)। हम सभी जानते हैं कि एक आईडी के साथ एपी एक पैराग्राफ है, लेकिन कौन जानता है कि बने-बनाए टैग क्या हैं? कम से कम मेरा यही विचार है। :) इसलिए यह कार्यक्षमता की तुलना में एक शैली / स्पष्टता का मुद्दा है।


3
धन्यवाद व्याकरण परी :)
runelynx

2

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


2

CSS एक स्टाइल शीट भाषा है जिसका उपयोग XML दस्तावेज़ों को प्रस्तुत करने के लिए किया जा सकता है, न केवल (X) HTML दस्तावेज़ों में। किए गए टैग के साथ आपका स्निपेट एक कानूनी XML दस्तावेज़ का हिस्सा हो सकता है; यह एक होगा यदि आप इसे एक मूल तत्व में संलग्न करते हैं। शायद आपके पास पहले से ही इसके <html> ...</html>आसपास है? कोई भी वर्तमान ब्राउज़र XML दस्तावेज़ प्रदर्शित कर सकता है।

बेशक यह बहुत अच्छा एक्सएमएल दस्तावेज नहीं है, इसमें व्याकरण और एक्सएमएल घोषणा का अभाव है। यदि आप इसके बजाय एक HTML घोषणा शीर्षक का उपयोग करते हैं (और शायद एक सर्वर कॉन्फ़िगरेशन जो सही माइम प्रकार भेजता है) तो यह बजाय अवैध HTML होगा।

(X) HTML के सादे XML पर लाभ हैं क्योंकि तत्वों का अर्थ अर्थ होता है जो वेब पेज प्रस्तुति के संदर्भ में उपयोगी होता है। उपकरण इस शब्दार्थ के साथ काम कर सकते हैं, अन्य डेवलपर्स अर्थ जानते हैं, यह कम त्रुटि वाला है और पढ़ने में बेहतर है।

लेकिन अन्य संदर्भों में प्रस्तुति को करने के लिए XML और / या XSLT के साथ CSS का उपयोग करना बेहतर है। यही तुमने किया। जैसा कि यह आपका काम नहीं था, आप नहीं जानते थे कि आप क्या कर रहे थे, और HTML / CSS सबसे बेहतर तरीका है कि आप अपने परिदृश्य में उस पर चिपके रहें।

आपको अपने दस्तावेज़ में एक (एक्स) HTML हेडर जोड़ना चाहिए ताकि उपकरण आपको सार्थक त्रुटि संदेश दे सकें।


2
नहीं, यह कानूनी (अच्छी तरह से गठित) XML बिल्कुल नहीं है। एक <style>तत्व है, और फिर ... एक <body>तत्व। एक XML दस्तावेज़ में केवल एक मूल तत्व होना चाहिए; इस मामले में, या तो <style>तत्व मूल तत्व है, लेकिन <body>हस्तक्षेप कर रहा है, या एक मूल तत्व को दोनों तत्वों को अपने बच्चों को जोड़ने की आवश्यकता है। जब तक आप <style>तत्व को एक स्टाइलशीट संदर्भ (यहां तक ​​कि एक डेटा यूआरआई की तरह <?xml-stylesheet href="data:text/css,imsocool { color: blue; }"?>सिर्फ ठीक काम करेगा) के साथ बदल देते हैं, तो रूट तत्व बन जाता है <body>
BoltClock

2

... मैं बस आईडी के साथ अपने सभी टैग को पैराग्राफ में बदल देता हूं।

मैं वास्तव में इसे कैसे ठीक से करने के अपने सुझाव के साथ मुद्दा लेता हूं।

  1. एक <p>टैग पैराग्राफ के लिए है। मैं लोगों को एक div के बजाय हर समय इसका उपयोग करते हुए देखता हूं - बस रिक्ति के प्रयोजनों के लिए या क्योंकि यह gentler लगता है। यदि यह एक पैराग्राफ नहीं है, तो इसका उपयोग न करें।

  2. जब तक आपको इसे विशेष रूप से लक्षित करने की आवश्यकता न हो (जैसे जावास्क्रिप्ट के साथ), आपको आईडी की जरूरत नहीं है। कक्षाओं का उपयोग करें या बस एक सीधा अप div।


2

अपने शुरुआती दिनों से CSS को मार्कअप अज्ञेय के रूप में डिज़ाइन किया गया था, इसलिए इसका उपयोग किसी भी मार्कअप लैंग्वेज प्रोड्यूसिंग ट्री एक जैसे डोम स्ट्रक्चर्स (उदाहरण के लिए SVG) के साथ किया जा सकता है। कोई भी टैग जो अनुपालन करता हैname token उत्पादन का है वह CSS में पूरी तरह से मान्य है। इसलिए आपका सवाल HTML के बजाय CSS के बारे में ही है।

कस्टम टैग वाले तत्व HTML5 विनिर्देश द्वारा समर्थित हैं। HTML5 इस तरीके को मानकीकृत करता है कि कैसे DOM में अज्ञात तत्वों को पार्स किया जाना चाहिए। तो HTML5 पहला HTML विनिर्देश है जो कस्टम तत्वों को सख्ती से बोलने में सक्षम बनाता है। आपको बस <!DOCTYPE html>अपने दस्तावेज़ में HTML5 सिद्धांत का उपयोग करने की आवश्यकता है ।

कस्टम टैग के रूप में खुद के नाम ...

यह दस्तावेज़ http://www.w3.org/TR/custom-elements/ आपके द्वारा चुने गए कस्टम टैग की अनुशंसा करता है जिसमें कम से कम एक '-' (डैश) प्रतीक है। इस तरह वे भविष्य के HTML तत्वों के साथ संघर्ष नहीं करेंगे। इसलिए आप अपने डॉक को कुछ इस तरह से बदलेंगे:

<style>
so-cool {
    color:blue;
}
</style>

<body>
    <so-cool>HELLO</so-cool>
</body> 

2

जाहिर तौर पर किसी ने इसका उल्लेख नहीं किया, इसलिए मैं करूंगा।

यह ब्राउज़र युद्धों का एक उप-उत्पाद है

1990 के दशक में जब इंटरनेट पहली बार मुख्यधारा में जाना शुरू कर रहा था, तो ब्राउज़र मार्केट में प्रतिस्पर्धा बढ़ गई। प्रतिस्पर्धी बने रहने और उपयोगकर्ताओं को आकर्षित करने के लिए, कुछ ब्राउज़रों (सबसे विशेष रूप से इंटरनेट एक्सप्लोरर) ने मदद करने की कोशिश की और "उपयोगकर्ता के अनुकूल" यह पता लगाने की कोशिश की कि पेज डिजाइनरों का क्या मतलब है और इस तरह मार्कअप की अनुमति दी गई जो गलत हैं (जैसे, <b><i>foobar</b></i>सही ढंग से बोल्ड के रूप में प्रस्तुत करना होगा- इटैलिक)।

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

जबकि कई लोगों ने सोचा था कि ब्राउज़र युद्ध समाप्त हो चुके हैं, पिछले कुछ वर्षों में ब्राउज़र विक्रेताओं के बीच एक नया युद्ध हुआ है क्योंकि क्रोम को रिलीज़ किया गया था, Apple ने फिर से बढ़ना शुरू कर दिया और सफारी को धक्का दिया, और IE ने अपना प्रभुत्व खो दिया। (ब्राउज़र विक्रेताओं द्वारा मानकों के कथित सहयोग और समर्थन के कारण आप इसे "शीत युद्ध" कह सकते हैं।) इसलिए, यह आश्चर्य की बात नहीं है कि समकालीन ब्राउज़र जो कथित तौर पर वेब मानकों के कड़ाई से अनुरूप हैं, वास्तव में "चतुर" होने की कोशिश करते हैं और इस तरह के मानक-तोड़ने वाले व्यवहार की अनुमति दें ताकि पहले की तरह एक लाभ प्राप्त करने की कोशिश की जा सके।

दुर्भाग्य से, इस अनुमेय व्यवहार ने बड़े पैमाने पर ( कुछ कैंसर भी कह सकते हैं) खराब रूप से चिह्नित वेबपेजों की वृद्धि हुई। क्योंकि IE सबसे उदार और लोकप्रिय ब्राउज़र था, और Microsoft द्वारा मानकों के निरंतर प्रवाह के कारण, IE खराब डिजाइन को प्रोत्साहित करने और बढ़ावा देने और टूटे हुए पृष्ठों को फैलाने और नष्ट करने के लिए बदनाम हो गया।

हो सकता है कि आप अभी के लिए कुछ ब्राउज़रों पर quirks और इस तरह के कारनामों का उपयोग कर पाएं, लेकिन सामयिक पहेली या गेम या कुछ और के अलावा, वेब पेज और साइट्स बनाते समय आपको हमेशा वेब मानकों से चिपके रहना चाहिए ताकि वे सही ढंग से प्रदर्शित हो सकें और ब्राउज़र अपडेट के साथ उन्हें टूटने (संभवतः पूरी तरह से अनदेखा) होने से बचें।


मैं तर्क देता हूं कि IE पर इस विशेष क्विक को दोष देना थोड़ा आधार है, क्योंकि जब आधिकारिक रूप से (HTML5 के लिए) नए टैग का एक गुच्छा जोड़ा गया था, तो IE एकमात्र प्रमुख ब्राउज़र था जिसे उन्हें स्टाइल करने के लिए एक विशिष्ट "शिम" की आवश्यकता थी । यह आंशिक रूप से अन्य ब्राउज़रों के अधिक आक्रामक अद्यतन शासनों (IE के पुराने संस्करण फ़ायरफ़ॉक्स के पुराने संस्करणों की तुलना में पुराने स्टिक) के नीचे था, लेकिन IE के "सबसे अधिक उदार" होने के विपरीत है।
IMSoP

एचटीएमएल 5? है ना? <imsocool>HTML5 में नया टैग नहीं है। इसका HTML5 या IE 8, 9, आदि से कोई लेना-देना नहीं है। इस प्रकार का व्यवहार कोई नई विडंबना नहीं है ; यह वर्षों पुराने ब्राउज़र-युद्धों का उप-उत्पाद है । यहां तक ​​कि अगर IE वर्तमान मानक अपराधों के लिए जिम्मेदार नहीं है (हालांकि वेब डेवलपर्स के ire के लिए, वे अभी भी ठीक से अनुरूप करने से इनकार करते हैं), वे निश्चित रूप से वर्षों के लिए खराब कोडिंग प्रथाओं को बढ़ावा देने के लिए कुख्यात थे। अधिक विशेष रूप से उदार ब्राउज़र (आईई सबसे खराब अपराधी) सबसे बुरे समय में आया था, ठीक उसी समय जब इंटरनेट बंद होने लगा था और वेब देवता HTML सीखना शुरू कर दिया था ... गलत तरीके से।
Synetech

मैंने यह नहीं कहा था कि एचटीएमएल 5 के साथ इसका कोई लेना-देना नहीं है, लेकिन इसका गैर-मानक टैग के साथ क्या करना है (उदाहरण के <header>लिए जब तक एचटीएमएल 5 मानक बन गया था) तब तक आईई के पुराने संस्करण निश्चित रूप से "सहिष्णु" नहीं हैं। लेनिनेंस भी गैर-अनुपालन के समान नहीं है - एचटीएमएल 5 एक अत्यंत व्यावहारिक मानक है जो स्वीकार करता है कि बुरी तरह से गठित एचटीएमएल पहले के डब्ल्यू 3 सी चश्मे के आदर्शवाद के विपरीत मौजूद होगा, और यह "उदारता" यकीनन वेब के विकास को लाभ पहुंचाता है।
IMSoP

फिर से, मैं किसी विशिष्ट ब्राउज़र या संस्करण के बारे में बात नहीं कर रहा हूँ। मैं समझा रहा हूं कि सामान्य रूप से अकेलापन ब्राउज़र-युद्धों का एक दुष्प्रभाव है। IE ने बहुत से गैर-मानक और यहां तक ​​कि लापता व्यवहार, अमान्य टैग और विशेषताओं, और गलत मिलान वाले टैग ( <b><i>foobar</b></i>) जैसे फ्लैट व्यवहार को भी सहन किया । यह कोई रहस्य नहीं है और यहां तक ​​कि एक अच्छी तरह से आलोचना की और बहुत बदनाम मुद्दा है। जैसा कि मैंने कहा, IE खराब मार्कअप की अनुमति देने वाला एकमात्र ब्राउज़र नहीं था, लेकिन क्योंकि इसमें इतनी बड़ी बाजार हिस्सेदारी थी और यह सही (या गलत) समय पर आया था, इसने सामान्य रूप से खराब मार्कअप में बड़ी राशि का योगदान दिया ।
सिंथेटेक

1

हालांकि ब्राउज़र आमतौर पर CSS से HTML टैग से संबंधित होते हैं, भले ही वे वैध हों या न हों, आपको ABSOLUTELY ऐसा नहीं करना चाहिए।

सीएसएस दृष्टिकोण से तकनीकी रूप से इसमें कुछ भी गलत नहीं है। हालाँकि, बने हुए टैग का उपयोग करना कुछ ऐसा है जो आपको HTML में कभी नहीं करना चाहिए।

HTML एक मार्कअप भाषा है, जिसका अर्थ है कि प्रत्येक टैग एक विशिष्ट प्रकार की जानकारी से मेल खाता है।

आपके बनाए टैग किसी भी प्रकार की जानकारी के अनुरूप नहीं हैं। यह Google जैसे वेब क्रॉलर से समस्याएं पैदा करेगा।

सही मार्कअप के महत्व के बारे में अधिक जानकारी पढ़ें ।

संपादित करें

डिव कई संबंधित तत्वों के समूहों को संदर्भित करते हैं, जिसका अर्थ ब्लॉक रूप में प्रदर्शित किया जाना है और इसे इस तरह से हेरफेर किया जा सकता है।

स्पैन उन तत्वों को संदर्भित करता है जिन्हें उस संदर्भ की तुलना में अलग ढंग से स्टाइल किया जाना है जो वर्तमान में हैं और इनलाइन प्रदर्शित होने के लिए हैं, न कि एक ब्लॉक के रूप में। एक उदाहरण है अगर एक वाक्य में कुछ शब्द सभी टोपियां होना चाहिए।

कस्टम टैग किसी भी मानक से संबंधित नहीं हैं और इस प्रकार स्पैन / डिव का उपयोग वर्ग / आईडी गुणों के साथ किया जाना चाहिए।

इसके लिए बहुत विशिष्ट छूट हैं, जैसे कि कोणीय जेएस


3
"कभी नहीं" कभी भी सही उत्तर नहीं है - आपको लगता है कि आप XHTML के बारे में भूल गए हैं;)
इज़ाकटा

divs और spans भी किसी भी प्रकार की जानकारी के अनुरूप नहीं हैं। Google और स्क्रीन रीडर उन लोगों को अच्छी तरह से संभालते हैं। सिमेंटिक मार्कअप का उपयोग करना महत्वपूर्ण है, लेकिन यह कस्टम टैग का उपयोग करने के खिलाफ एक तर्क नहीं है।
गोलजट्रोल

2
डिव कई संबंधित तत्वों के समूहों को संदर्भित करते हैं, जिसका अर्थ ब्लॉक रूप में प्रदर्शित किया जाना है और इस तरह से हेरफेर किया जाना है। स्पैन उन तत्वों को संदर्भित करता है जिन्हें समान रूप से स्टाइल किया जाना है और उनका मतलब इनलाइन प्रदर्शित होना है, न कि एक ब्लॉक के रूप में। कस्टम टैग किसी भी मानक से संबंधित नहीं हैं और इस प्रकार स्पैन / डिव का उपयोग वर्ग / आईडी गुणों के साथ किया जाना चाहिए।
दान ग्रीन-लीपसीगर

मैंने आपके स्क्रीन पाठकों के बारे में थोड़ा हटा दिया क्योंकि यह गलत है। सहायक तकनीक <imsocool>some awesome text</imsocool>ठीक पढ़ेगी क्योंकि इसकी व्याख्या की जाएगी <>...</>। ऐसा नहीं होगा कि वे स्वतंत्र रूप से पाठ के उस भाग में नहीं जा पाएंगे, जैसे कि यह एक था <p>। बेशक, अगर आपने अपना DOCTYPE लिखा और मैप imsocoolकिया p, तो यह काम करेगा।
रयान बी

0

हालांकि CSS में एक "टैग चयनकर्ता" नामक एक चीज है, लेकिन यह वास्तव में नहीं जानता कि टैग क्या है। यह दस्तावेज़ की भाषा को परिभाषित करने के लिए छोड़ दिया गया है। CSS को केवल HTML के साथ ही नहीं, बल्कि XML के साथ भी उपयोग करने के लिए डिज़ाइन किया गया था, जहां (यह मानकर कि आप DTD या अन्य सत्यापन योजना का उपयोग नहीं कर रहे हैं) टैग कुछ भी हो सकते हैं। आप इसे अन्य भाषाओं के साथ भी उपयोग कर सकते हैं, हालांकि आपको "टैग" और "विशेषताओं" जैसी चीज़ों के लिए अपने स्वयं के शब्दार्थ के साथ आने की आवश्यकता होगी।

ब्राउज़र आमतौर पर HTML में अज्ञात टैग के लिए CSS लागू करते हैं, क्योंकि यह पूरी तरह से तोड़ने से बेहतर माना जाता है: कम से कम वे कुछ प्रदर्शित कर सकते हैं। लेकिन जानबूझकर "नकली" टैग का उपयोग करना बहुत बुरा है। इसका एक कारण यह है कि नए टैग समय-समय पर परिभाषित नहीं होते हैं, और यदि कोई ऐसा परिभाषित किया गया है जो आपके नकली टैग की तरह दिखता है, लेकिन उसी तरह से काम नहीं करता है, तो यह नए ब्राउज़रों पर आपकी साइट के साथ समस्या पैदा कर सकता है।


0

CSS नकली तत्वों के साथ क्यों काम करता है? क्योंकि यह किसी को चोट नहीं पहुँचाता है क्योंकि आप उन्हें वैसे भी उपयोग करने वाले नहीं हैं।

मेरे प्रोफेसर मुझे बने हुए तत्वों का उपयोग क्यों नहीं करना चाहते? क्योंकि अगर उस तत्व को भविष्य में एक विनिर्देश द्वारा परिभाषित किया गया है, तो आपके तत्व में अप्रत्याशित व्यवहार होगा।

इसके अलावा, उसे यह क्यों नहीं पता था कि निर्मित तत्व मौजूद हैं और CSS के साथ काम करते हैं। क्या वे असामान्य हैं? क्योंकि वह अधिकांश अन्य वेब डेवलपर्स की तरह समझते हैं कि हमें उन चीजों का उपयोग नहीं करना चाहिए जो भविष्य में बेतरतीब ढंग से टूट सकती हैं।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.