स्पॅन आणि विभाग HTML घटक कसे वापरावे

अधिक शैली आणि लेआउट नियंत्रणसाठी स्पॅन आणि सीव्ही वापरा सीएसएस साठी.

बरेच लोक जे वेब डिझाईन आणि एचटीएमएल / सीएसएस वर नवीन आहेत ते आणि

घटक एका परस्परांमध्ये वापरतात कारण ते वेबपेज तयार करतात. वास्तविकता, तथापि, या प्रत्येक HTML तत्व वेगवेगळ्या उद्देशाने सेवा देतात. प्रत्येक अभिप्रायाच्या उद्देशाने वापरणे शिकणे आपल्याला क्लिनर वेब पृष्ठ विकसित करण्यास मदत करेल ज्याने कोड सर्वत्र व्यवस्थापित करणे सोपे आहे.

एलिमेंट वापरून

DIV घटक आपल्या वेब पृष्ठावर तार्किक विभाग परिभाषित करतो.

हे मूलतः एक बॉक्स आहे ज्यात आपण इतर HTML घटक ठेवू शकता जे तार्किकदृष्टया एकत्रितपणे जातात परिच्छेद, शीर्षके, सूच्या, लिंक्स, प्रतिमा इ. सारख्या विभागात अनेक इतर घटक असू शकतात. आपल्या HTML दस्तऐवजात अतिरिक्त संरचना आणि संस्था प्रदान करण्यासाठी त्यामध्ये इतर विभाग देखील असू शकतात.

डिव्हिजन घटक वापरण्यासाठी, आपल्या पृष्ठाच्या क्षेत्रापुढे एक खुली

टॅग ठेवा ज्या आपण एक स्वतंत्र विभाग म्हणून इच्छुक आहात, आणि नंतर एक बंद टॅग करा:

डिव्हीची सामुग्री

जर आपल्या पृष्ठाचे क्षेत्रास थोड्या अतिरिक्त माहितीची आवश्यकता असेल ज्याचा आपण नंतर सीएसएस सोबत शैली वापरेल, तर आपण आयडी सिलेक्टर जोडू शकता (उदा.

id = "myDiv">), किंवा क्लास निवडकर्ता (उदा. वर्ग = "बड़ाडिव्हि">). दोन्ही विशेषता नंतर सीएसएस वापरून किंवा जावास्क्रिप्ट वापरून सुधारित केले जाऊ शकतात. सध्याची सर्वोत्तम पद्धती आयडी निवडण्याऐवजी वर्ग निवडकर्त्यांचा वापर करण्याच्या दिशेने वाटचाल करते, कारण काही विशिष्ट आयडी निवडकर्ता आहेत. खरेतर, तथापि, आपण एकतर वापरू शकता आणि आयडी आणि श्रेणी निवड करणारा दोन्ही विभाग देखील देऊ शकता.

विरूद्ध
कधी वापरावे

डिव्हिजन घटक HTML5 विभाग घटकापेक्षा भिन्न आहे कारण तो संलग्न केलेल्या सामुग्रीस कोणत्याही शब्दार्थाचा अर्थ देत नाही. सामग्रीचा ब्लॉक डिव्ही किंवा विभाग असावा किंवा नाही याबद्दल आपल्याला खात्री नसल्यास घटक आणि सामग्रीचा उद्देश काय आहे याचा निर्णय घेण्यात आपली मदत करणे यावर विचार करा:

  • पृष्ठाच्या त्या भागातील शैली जोडण्यासाठी आपण घटक आवश्यक असल्यास, आपण div घटक वापरावे.
  • समाविष्ठ असलेल्या सामग्रीमध्ये एक वेगळा फोकस आहे आणि तो स्वतःच उभा राहू शकतो, आपण त्याऐवजी विभाग घटक वापरू इच्छित असाल.

शेवटी, दिवे आणि विभाग दोन्ही सारखेच वागतात आणि आपण त्यापैकी कशाचा तरी गुणधर्म देऊ शकता आणि आपल्याला आवश्यक असलेल्या आपल्या साइटचे स्वरूप प्राप्त करण्यासाठी सीएसएससह त्यांना शैली देऊ शकता. या दोन्ही ब्लॉक स्तर घटक आहेत.

एलिमेंट वापरून

कालावधी घटक डीफॉल्ट म्हणून एक इनलाइन घटक असतो. हे डिव आणि विभाग घटकांशिवाय सेट करते स्पॅन घटक बहुधा सामग्रीचे विशिष्ट भाग, सामान्यत: मजकूराची तोडणी करण्यासाठी वापरले जाते जेणेकरुन ते आणखी एक "हुक" मिळवू शकेल जे नंतर शैलीबद्ध करता येते. सीएसएससह वापरले गेलेले, हे त्यास संलग्न केलेल्या मजकुराची शैली बदलू शकते; तथापि, कोणत्याही शैली गुणविशेषांशिवाय, स्पॅन घटकांचा केवळ मजकूर वर काहीही परिणाम होत नाही.

कालावधी आणि div घटक दरम्यान हे मुख्य फरक आहे. वर नमूद केल्याप्रमाणे, div घटकात एक पॅराग्राफ ब्रेक समाविष्ट आहे, तर स्पॅन घटक केवळ ब्राउझरला संबद्ध सीएसएस शैली नियम लागू करण्यासाठी टॅग्सने जोडलेले आहे असे सांगते:


हायलाइट केलेला मजकूर आणि बिगर हायलाइट केलेला मजकूर.

CSS = "highlight"> सह शैली करण्यासाठी शैलीमधील घटक = "हायलाइट" किंवा अन्य वर्ग जोडा.

कालावधी घटकमध्ये कोणतेही आवश्यक गुणधर्म नाहीत, परंतु त्या सर्वात उपयोगी अशा तीन गोष्टी डिव्ह घटकाच्या समान आहेत:

  • शैली
  • वर्ग
  • आयडी

जेव्हा आपण दस्तऐवजातील नवीन ब्लॉक-स्तरीय घटकांप्रमाणे ती सामग्री परिभाषित न करता सामग्रीची शैली बदलू इच्छिता तेव्हा कालावधी वापरा.

उदाहरणार्थ, जर आपल्याला लाल रंगाच्या H3 शीर्षकाचा दुसरा शब्द हवा असेल तर आपण त्या शब्दास स्पॅन घटकांसह फिरवू शकता जो त्या शब्दाला लाल मजकूर म्हणून शैली देईल. हा शब्द अजूनही एच 3 घटकांचा भाग आहे, परंतु आता लाल रंगात देखील प्रदर्शित होतो:

हे माझे अप्रतिम मथळा आहे

2/2/17 रोजी जेरेमी गिरर्ड द्वारा संपादित