DIV र सेक्टरको बीच के फरक छ?

HTML5 SECTION तत्व बुझ्दै

जब एचटीएमएल 5 ले धेरै वर्ष अघि दृश्यमा फन्ट गर्दछ, यसले लिङ्गेजमा नयाँ सेक्शनिंग तत्वहरूको गुच्छा थप्यो, जसमा SECTION तत्व समावेश छ। अधिकांश HTML हरू जसले एचटीएमएल 5 परिचयलाई स्पष्ट प्रयोग गर्दछ। उदाहरणका लागि, तत्वलाई वेब पेजको लेख र मुख्य भागहरू परिभाषित गर्नको लागि प्रयोग गरिन्छ, तत्वलाई पृष्ठको बाँकीमा महत्त्वपूर्ण छैन परिभाषित सामग्री परिभाषित गर्न प्रयोग गरिन्छ, र हेडर, नेभिगेसन र फुटरले सुन्दर आत्म-व्याख्यात्मक छन्। तथापि, नयाँ थप SECTION तत्त्व एकदम कम स्पष्ट छ।

धेरै व्यक्तिहरूले विश्वास गर्छन् कि HTML तत्वहरू SECTION र वास्तवमा एउटै चीज-सामान्य कंटेनर तत्वहरू वेब पेजमा सामग्री समावेश गर्न प्रयोग गरिन्छ। तथापि, तथापि, यी दुई तत्वहरू, जबकि दुवै कन्टेनर तत्वहरू छन्, केही तर सामान्य हो। त्यहाँ SECTION तत्व र DIV तत्व प्रयोग गर्नका लागि विशिष्ट कारणहरू छन् - र यो लेखले यी मतभेदहरूको वर्णन गर्नेछ।

खण्डहरू र डिभिजनहरू

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

यसको विपरीत, तपाइँ पृष्ठको भागहरूको लागि DIV तत्व प्रयोग गर्नुहुन्छ जुन तपाइँ विभाजित गर्न चाहानुहुन्छ, तर सेन्ट्याटिक्स भन्दा अन्य उद्देश्यका लागि। म एक विभाजन मा सामग्री को एक क्षेत्र लपेटें यदि म यति नै गरेर गरेर रहयो हूँ कि मलाई आफु को "हुक" सीएसएस संग उपयोग गर्न को लागि। यो उपन्यासहरूमा आधारित सामग्रीको एक फरक खण्ड हुन सक्दैन, तर मेरो पृष्ठको लागि लेआउट प्राप्त गर्न प्राप्त गर्न केहि चीज हो।

यो सबै सिमन्टिक्सको बारेमा

यो बुझ्न एक कठिन अवधारणा हो, तर DIV तत्व र SECTION तत्त्व बीचको मात्र भिन्नता अर्थशास्त्र हो। अन्य शब्दहरूमा, तपाई विभाजित गर्दै कोडको सेक्शनको अर्थ हो।

कुनै पनि सामग्री जुन डीआईवी तत्व भित्र समावेश छ कुनै पनि निहित अर्थ छैन। यो चीजहरूको लागि राम्रो तरिकाले प्रयोग गरिन्छ:

DIV तत्व हामीले हाम्रा कागजातहरू शैली र स्तम्भहरू र फैंसी लेआउटहरू सिर्जना गर्न हुक थप्नका लागि मात्र एक मात्र तत्त्व प्रयोग गर्दथे। यसको कारण, हामी एचटीटीएलसँग समाप्त हुनुभयो जो डिआईवी तत्वहरूसँग भरि भएको थियो-के वेब डिजाइनरहरूले "डिभाइटिस" बोलाउन सक्थे। त्यहाँ पनि WYSIWYG सम्पादकहरू थिए जसले DIV तत्वलाई विशेष रूपमा प्रयोग गर्यो। मैले वास्तवमा HTML मा चलाएको छु जुन अनुच्छेदहरूको सट्टामा DIV तत्व प्रयोग गर्दछ!

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

स्पान तत्वको बारेमा के हो?

अर्को तत्व जसले धेरै व्यक्तिलाई DIV तत्वको बारेमा सोच्न सोच्दछ त्यो तत्व हो। यो तत्व, जस्तै DIV, एक अर्ध तत्व छैन। यो एक इनलाइन तत्व हो जुन तपाईं सामग्रीको इनलाइन ब्लकहरू (सामान्यतया पाठ) को लागि शैलीहरू र लिपिको लागि हुकहरू थप्न प्रयोग गर्न सक्नुहुनेछ। त्यस अर्थमा यो DIV तत्वको जस्तै हो, केवल ब्लक तत्वको सट्टा मात्र इनलाइन। केहि तरिकाहरूमा, DIV को ब्लक-स्तरीय SPAN तत्वको रूपमा सोच्न सजिलो हुन सक्छ र यसलाई प्रयोग गर्नुहोस् जुन तपाईं HTML सामग्रीको सम्पूर्ण ब्लकहरूको लागि मात्र SPAN हुनेछ।

त्यहाँ HTML5 मा कुनै तुलनीय इनलाइन सेक्शनिंग तत्त्व छैन।

Internet Explorer को पुरानो संस्करणहरुको लागि

यदि तपाईं IE को नाटकीय रूपमा पुरानो संस्करणहरू समर्थन गर्दै हुनुहुन्छ (जस्तै IE 8 र निचोटि) जुन HTML5 लाई राम्ररी रूपमा चिन्न नपाइन्छ, तपाईले समान रूपमा एचटीएमएल ट्यागहरू प्रयोग गर्न डरोउनु हुँदैन। उपन्यासहरूले तपाईंलाई र तपाईंको टोलीलाई भविष्यमा पृष्ठ व्यवस्थापन गर्न मद्दत गर्नेछ (किनभने तपाईं थाहा पाउनुहुनेछ कि सेक्सन यो लेख हो यदि यो ARTICLE तत्त्व द्वारा घनिष्ठ छ)। साथै, ब्राउजरहरूले ती ट्यागहरू चिन्न सक्नेछन् तिनीहरूलाई अझ राम्रो समर्थन गर्दछ।

तपाइँ अझै पनि इन्टरनेट एक्सप्लोररसँग HTML5 सेटिटिक सेक्शन तत्वहरू प्रयोग गर्न सक्नुहुन्छ, तपाइँ भर्खरै स्क्रिप्टिङ र सम्भावित केही वरिपरि DIV तत्वहरू थप्न आवश्यक छ जुन तिनीहरूलाई एचटीएमएलको रूपमा ट्याग पहिचान गर्न आवश्यक छ।

DIV र SECTION तत्वहरू प्रयोग गर्दै

यदि तपाईं तिनीहरूलाई प्रयोग गर्दै हुनुहुन्छ भने, तपाईं DIV र SECTION तत्त्वहरू एक साथ मान्य एचटीएमएल 5 कागजातमा प्रयोग गर्न सक्नुहुनेछ। यस लेखमा तपाईले यहाँ देख्नु भएको छ भने, तपाइँ सामाग्रीको सेमेन्टिक असामान्य भागहरू परिभाषित गर्नको लागि SECTION तत्व प्रयोग गर्नुहुन्छ, र तपाईँले DIV तत्व CSS र जाभास्क्रिप्टको लागि हुकको रूपमा प्रयोग गर्दछ साथै साथसाथै परिभाषित लेआउटमा अर्थान्तिक अर्थ छैन।

जेनिफर क्रिनिन द्वारा मूल लेख। 3/17/17 मा जेरेमी गिरर्ड द्वारा सम्पादित