CSS वापरून एचटीएमएल नेस्टेड क्रमांकित सूचींमध्ये योग्य क्रमांकन करणे. बुलेट केलेल्या सूचींसाठी CSS क्रमांकन मानक बुलेटसाठी शैली

क्रमांकित सूची त्यांच्या अनुक्रमांकांसह घटकांचा संग्रह आहे. क्रमांकाचे प्रकार आणि प्रकार घटक पॅरामीटर्सवर अवलंबून असतात

, जे सूची तयार करण्यासाठी वापरले जाते. खालील मूल्ये क्रमांकन घटक म्हणून काम करू शकतात:
• अरबी अंक (1, 2, 3, ...);
• दहा (01, 02, 03, ...,10) पेक्षा कमी संख्येसाठी अग्रगण्य शून्य असलेले अरबी अंक;
• कॅपिटल लॅटिन अक्षरे (A, B, C, ...);
• लोअरकेस लॅटिन अक्षरे (a, b, c, ...);
• अप्परकेस रोमन अंक (I, II, III, ...);
• लोअरकेस रोमन अंक (i, ii, iii, ...);
• आर्मेनियन क्रमांकन;
• जॉर्जियन क्रमांकन.

व्यावहारिक दृष्टिकोनातून, घटक प्रदर्शित करण्याचे सिद्धांत बुलेट केलेली यादीक्रमांकित सूचीप्रमाणेच लागू केले जाऊ शकते. परंतु आम्ही एका गणनेसह काम करत आहोत हे लक्षात घेता, काही वैशिष्ट्ये आहेत ज्यांची पुढे चर्चा केली जाईल.

सूची क्रमांकन

कोणत्याही क्रमांकावरून यादी सुरू करण्याची परवानगी आहे; या उद्देशासाठी घटकाचा प्रारंभ गुणधर्म वापरला जातो

किंवा घटकाचे मूल्य
1. . मूल्य हे कोणतेही धन पूर्णांक आहे. सूची म्हणून लॅटिन अक्षरे वापरली असली तरीही कोणत्या प्रकारची संख्या सेट केली आहे हे महत्त्वाचे नाही. जर प्रारंभ आणि मूल्य दोन्ही गुणधर्म एकाच वेळी सूचीवर लागू केले असतील, तर नंतरचे प्राधान्य घेते आणि उदाहरण 1 मध्ये दर्शविल्याप्रमाणे मूल्याद्वारे निर्दिष्ट केलेल्या संख्येवरून क्रमांकन प्रदर्शित केले जाते.

   उदाहरण 1: सूची क्रमांक बदलणे

   4. तुम्ही तुमच्या कामाच्या ठिकाणी चांगली काळजी घ्यावी.
   5. खोलीतील प्रकाश व्यवस्था समायोजित करा जेणेकरून प्रकाश स्रोत ऑपरेटरच्या बाजूला किंवा मागे असेल.
   10. वैद्यकीय गुंतागुंत टाळण्यासाठी, मऊ आसन असलेली खुर्ची निवडण्याची शिफारस केली जाते.

   या उदाहरणातील सूचीचा पहिला घटक रोमन अंक IV ने सुरू होईल, कारण start="4" विशेषता निर्दिष्ट केली आहे, त्यानंतर क्रमांक V येतो आणि शेवटचा घटक क्रमाबाहेर येतो आणि त्याला X क्रमांक नियुक्त केला जातो (आकृती 1).

   तांदूळ. 1. यादीतील रोमन अंक

   अंक लिहित आहे

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

   

   तांदूळ. 2. ब्रॅकेटसह क्रमांकित सूची दृश्य

   शैली तुम्हाला सामग्री आणि प्रति-वृद्धी गुणधर्म वापरून सूची क्रमांकाचे प्रकार बदलण्याची परवानगी देतात. प्रथम, ol सिलेक्टरला काउंटर-रीसेट वर सेट करणे आवश्यक आहे : आयटम , हे आवश्यक आहे जेणेकरून प्रत्येक नवीन सूचीमधील क्रमांकन पुन्हा सुरू होईल. अन्यथा, क्रमांकन चालू राहील आणि 1,2,3 ऐवजी तुम्हाला 5,6,7 दिसेल. आयटम मूल्य हे काउंटरसाठी एक अद्वितीय अभिज्ञापक आहे आम्ही ते स्वतः निवडतो. पुढे, तुम्हाला मूळ मार्कर स्टाईल प्रॉपर्टी लिस्ट-स्टाईल-टाइप द्वारे लपवावे लागतील ज्यामध्ये कोणतेही मूल्य नाही.

   सामग्री गुणधर्म विशेषत: ::नंतर आणि ::पूर्वी स्यूडो-एलिमेंट्सच्या संयोगाने कार्य करते. अशा प्रकारे, li::before कंस्ट्रक्शन म्हणते की सूचीच्या प्रत्येक घटकापूर्वी काही सामग्री जोडली जाणे आवश्यक आहे (उदाहरण 2).

   उदाहरण 2. तुमची स्वतःची क्रमांकन तयार करणे

   ली::पूर्वी ( सामग्री: काउंटर(आयटम) ") "; /* संख्यांमध्ये कंस जोडा */ counter-increment: आयटम; /* काउंटरचे नाव सेट करा */)

   व्हॅल्यू काउंटर(आयटम) असलेली सामग्री गुणधर्म संख्या प्रदर्शित करते; या उदाहरणात दाखवल्याप्रमाणे कंस जोडून, ​​आपल्याला आवश्यक प्रकारची संख्या मिळते. सूची क्रमांक एकने वाढवण्यासाठी प्रति-वाढीची आवश्यकता आहे. लक्षात घ्या की समान ओळखकर्ता, नावाचा आयटम, सर्वत्र वापरला जातो. अंतिम कोड उदाहरण 3 मध्ये दर्शविला आहे.

   उदाहरण 3: सूची दृश्य बदलणे

   1. पहिला
   2. दुसरा
   3. तिसऱ्या
   4. चौथा

   वरील पद्धतीचा वापर करून, तुम्ही कोणत्याही प्रकारची क्रमांकित यादी बनवू शकता, उदाहरणार्थ, एक संख्या घ्या चौकोनी कंस, शैलीतील फक्त एक ओळ बदलेल.

   सामग्री: "[" काउंटर(आयटम) "] ";

   रशियन अक्षरे असलेली यादी

   सह क्रमांकित यादी आहे लॅटिन अक्षरांसह, परंतु सूचीसाठी कोणतीही रशियन अक्षरे नाहीत. वरील तंत्राचा वापर करून ते कृत्रिमरित्या जोडले जाऊ शकतात. क्रमांकन शैलींद्वारे केले जात असल्याने, सूची स्वतःच मूळ राहते, फक्त निवडलेला वर्ग त्यात जोडला जातो, चला त्याला सिरिलिक म्हणू (उदाहरण 4).

   उदाहरण ४: सूची तयार करण्यासाठी कोड

   1. एक
   2. दोन
   3. तीन

   अक्षरे जोडणे ::before pseudo-element आणि content गुणधर्म वापरून केले जाते. प्रत्येक ओळीचे स्वतःचे अक्षर असणे आवश्यक असल्याने, कंसात लिहिलेल्या अक्षर क्रमांकासह, आम्ही छद्म वर्ग :nth-child(1) वापरू. पहिले अक्षर, स्वाभाविकपणे, A आहे, दुसरे B आहे, तिसरे C आहे, इ. हा संपूर्ण संच li सिलेक्टरमध्ये खालीलप्रमाणे जोडला आहे (उदाहरण 5).

   उदाहरण 5: छद्म-वर्ग:nth-मुल वापरणे

   सिरिलिक li:nth-child(1)::before ( content: "a)"; ) .cyrilic li:nth-child(2)::before ( सामग्री: "b)"; ) .cyrilic li:nth-child(3)::before ( सामग्री: "at)"; )

   या उदाहरणात, प्रत्येक अक्षरानंतर कंस येतो, सर्व अक्षरे लोअरकेस आहेत. तुम्ही तुमचा स्वतःचा सूची क्रमांकनचा प्रकार परिभाषित करू शकता, उदाहरणार्थ त्यात एक किंवा दोन कंसांसह किंवा फक्त अक्षरे असलेली कॅपिटल अक्षरे असू शकतात. मानक क्रमांकाच्या विपरीत, आम्ही येथे आम्हाला हवे ते करण्यास मोकळे आहोत. जवळजवळ सर्व परिस्थितींसाठी दहा अक्षरांची यादी पुरेशी असली पाहिजे, परंतु जर हे अचानक पुरेसे नाही असे दिसून आले तर, रशियन वर्णमालेतील किमान सर्व अक्षरे समाविष्ट करण्यासाठी आमची यादी विस्तृत करण्यापासून काहीही प्रतिबंधित करत नाही.

   आम्ही शेवटी अक्षरांचे संरेखन आणि स्थान समायोजित करतो, वैकल्पिकरित्या फॉन्ट आकार, रंग आणि इतर पॅरामीटर्स निर्दिष्ट करतो (उदाहरण 6).

   उदाहरण 6. रशियन अक्षरे असलेली यादी

   1. बोर्श
   2. पाईक कटलेट
   3. कुलेब्याका
   4. आंबट मलई मध्ये मशरूम
   5. कॅविअर सह पॅनकेक्स
   6. क्वास

   परिणाम हे उदाहरणअंजीर मध्ये दर्शविले आहे. 3.

   
   

   बऱ्याचदा आपल्याला क्रमांकन वापरावे लागते: विविध याद्या, याद्या तयार करताना, सामग्रीची सारणी किंवा सामग्री सारणी इ.

   CSS क्रमांकन प्रक्रिया स्वयंचलित करण्यासाठी काउंटर वापरते.

   चला एका साध्या उदाहरणाने सुरुवात करूया. त्यानंतर, अधिक क्लिष्ट मार्गाने, आम्ही त्यातील आयटम आणि उप-आयटमच्या स्वयंचलित क्रमांकासह नेस्टेड सूची तयार करू.

   मीटर ओळख

   प्रथम आपल्याला मीटर ओळखण्याची आवश्यकता आहे.

   काउंटर-रीसेट गुणधर्म वापरून, काउंटरला नाव आणि प्रारंभिक मूल्य नियुक्त केले जाते. नाव काहीही असू शकते, परंतु संख्येने सुरू होऊ शकत नाही.

   कोड स्निपेट:

   ही एंट्री टॅगसाठी असे म्हणते 3 चे प्रारंभिक मूल्य असलेला काउंटर नावाचा क्रमांक स्थापित केला आहे.

   डीफॉल्टनुसार, काउंटरचे प्रारंभिक मूल्य 0 आहे.

   काउंटर वाढ

   यासाठी काउंटर-इन्क्रिमेंट प्रॉपर्टी वापरली जाते. हे काउंटर वाढ निर्दिष्ट करण्यासाठी देखील वापरले जाते - ज्या संख्येने काउंटर मूल्य वाढेल.

   कोड स्निपेट:

   मुख्य भाग (काउंटर-रीसेट : क्रमांक 3 ;)
   body p ( काउंटर-इन्क्रीमेंट : क्रमांक 3 ; }

   हा कोड स्निपेट म्हणते की परिच्छेद ( टॅग

   ) दस्तऐवजाच्या मुख्य भागामध्ये 3 च्या वाढीमध्ये संख्या काउंटरसह क्रमांकित केले जाईल.

   पहिल्या परिच्छेदाला 6 क्रमांक दिला जाईल, कारण काउंटरचे प्रारंभिक मूल्य 3 आहे आणि त्याची वाढ 3 आहे.

   काउंटर वाढीसाठी डीफॉल्ट मूल्य 1 आहे.

   आता सर्व आवश्यक काउंटर पॅरामीटर्स सेट केले आहेत: नाव, प्रारंभिक मूल्य, वाढ आणि घटक जे क्रमांकित केले जातील. पुढील....

   काउंटर प्रदर्शन

   आता आपल्याला काउंटर मूल्य प्रदर्शित करण्याची आणि त्याच्या स्थानासाठी नियम सेट करण्याची आवश्यकता आहे. हे सामग्री गुणधर्म आणि स्यूडो-एलिमेंट्सच्या आधी आणि नंतर वापरून केले जाते.

   सामग्री गुणधर्म आधी सामग्री समाविष्ट करते ( आधी) किंवा नंतर ( नंतर) निर्दिष्ट घटकाचा.

   कोड स्निपेट:

   मुख्य भाग (काउंटर-रीसेट : क्रमांक 3 ;)
   शरीर p: नंतर ( काउंटर-इन्क्रीमेंट : क्रमांक 3 ; सामग्री : " समतुल्य " काउंटर (संख्या) "." ;)

   म्हणून, मागील कोड स्निपेटमध्ये आम्ही एक सामग्री गुणधर्म जोडला आहे जो "समान" शब्द मुद्रित करतो आणि त्यानंतर काउंटर क्रमांकाचे मूल्य आणि एक बिंदू "." . हे सर्व परिच्छेद सामग्री नंतर पृष्ठावर घातले आहे ( टॅग

   ), जे नंतरचे स्यूडो-एलिमेंट म्हणतात.

   अखेरीस...

   खाली वर्णन केलेले उदाहरण आहे.

   कोड स्निपेट:

   
   
   
   
   

   
   

   २ वेळा ३

   
   

   3 वेळा 3

   
   

   ४ वेळा ३

   
   

   ५ वेळा ३

   
   

   परिणाम:

   स्वयंचलित क्रमांकासह नेस्टेड याद्या

   नेस्टेड याद्या क्रमांकित करण्याची प्रक्रिया स्वयंचलित करण्यासाठी काउंटर वापरण्याचे उदाहरण पाहू.

   तुम्हाला HTML वरून आणि CSS मधील सूचीचा अभ्यास करताना आधीच माहित असले पाहिजे की सूची आयटम स्वयंचलितपणे क्रमांकित केले जातात. परंतु ही संख्या सर्वात सोपी आहे.

   त्याबद्दल काय स्वयंचलित क्रमांकन 1.1, 1.2, 2.1, 2.2, इ. सारखे उपखंड?

   या समस्येचे निराकरण काउंटर वापरून केले जाते जे आपल्याला नेस्टेड सूची क्रमांकित करण्याच्या प्रक्रियेस स्वयंचलित करण्याची परवानगी देतात.

   कोड स्निपेट:

   
   
   
   
   

   
   

   1. प्रथम सूची आयटम
   
   
   1. परिच्छेद १ चा पहिला उपपरिच्छेद
   
   
   2. 1ल्या परिच्छेदाचा दुसरा उपपरिच्छेद
   
   
   2. यादीतील दुसरा आयटम
   
   
   1. परिच्छेद २ चा पहिला उपपरिच्छेद
   
   
   2. दुसऱ्या परिच्छेदाचा दुसरा उपपरिच्छेद
   
   
   3. यादीतील तिसरा आयटम
   
   
   1. परिच्छेद ३ चा पहिला उपपरिच्छेद
   
   
   2. 3र्या परिच्छेदाचा दुसरा उपपरिच्छेद
   
   
   3. 3र्या परिच्छेदाचा तिसरा उपपरिच्छेद
   
   

   
   

   परिणाम:

   अशा प्रकारे तुम्ही नेस्टेड सूची क्रमांकित करण्याची प्रक्रिया स्वयंचलित करता!

   तुम्ही ऑर्डर केलेल्या सूचींमध्ये रेखा क्रमांक (अंक) च्या CSS शैली बदलण्याचा प्रयत्न केला असल्यास

   , नंतर तुम्हाला कदाचित समस्या आल्या. CSS निवडक वापरून या घटकांच्या शैलीपर्यंत पोहोचणे अशक्य आहे. परंतु बऱ्याचदा इंटरफेस डिझाइनमध्ये त्याचा रंग, पार्श्वभूमी, आकार इ. बदलणे समाविष्ट असते.

   अनस्टाइल सूचीचे हे सर्वात सोपे उदाहरण आहे:

   html

   1. झाड लावायचे
   2. घर बांध
   3. एक मुलगा वाढवा

   वरील समस्येचे निराकरण करण्याचे अनेक मार्ग पाहू या.

   पारंपारिकपणे एक अनाड़ी मार्ग.

   या समस्येचे निराकरण करण्याचा पारंपारिक मार्ग म्हणजे ब्राउझरद्वारे स्वयंचलितपणे नियुक्त केलेले रेखा क्रमांक लपवणे. या प्रकरणात, सूची-शैली: काहीही नाही; .

   css

   li( list-style: none; ) .num( रंग: पांढरा; पार्श्वभूमी: #2980B9; डिस्प्ले: इनलाइन-ब्लॉक; मजकूर-संरेखित: केंद्र; समास: 5px 10px; रेखा-उंची: 40px; रुंदी: 40px; उंची: 40px)

   html

   1. 1झाड लावायचे
   2. 2घर बांध
   3. 3एक मुलगा वाढवा

   सहमत आहे, ते निरर्थक आणि लवचिक दिसते. आम्ही स्वयंचलितपणे नियुक्त केलेले अनुक्रम क्रमांक लपवतो आणि ते व्यक्तिचलितपणे बदलतो दिलेली मूल्ये, आम्ही लेआउट बंद करतो, इ.

   लेआउट बंद न करता आणि pseudo-element::before आणि CSS गुणधर्म सामग्री , counter-increment , counter-reset न वापरता आपण समान परिणाम कसे मिळवू शकतो ते पाहू या.

   एक सुंदर आणि योग्य मार्ग.

   प्रथम आम्ही कोड आणि डेमो देऊ, आणि मग काय आहे ते आम्ही शोधू.

   css

   ol( counter-reset: myCounter; ) li( list-style: none; ) li:before ( counter-increment: myCounter; content:counter(myCounter); रंग: पांढरा; पार्श्वभूमी: #2980B9; प्रदर्शन: इनलाइन-ब्लॉक; मजकूर-संरेखित: समास: 5px 10px रेखा-उंची: 40px;

   html

   1. झाड लावायचे
   2. घर बांध
   3. एक मुलगा वाढवा

   जसे आपण पाहू शकता, html कोड स्वच्छ आणि सुंदर आहे. या प्रकरणात, सूची घटकांची सर्व शैली css वर हस्तांतरित केली जाते.

   चला बिंदू बिंदू पाहू:

   • li::पूर्वी- सूचीमध्ये एक छद्म-घटक तयार करते, जे पहिल्या मुलाची जागा घेते.
   • काउंटर-रीसेट:मायकाउंटर;- प्रत्येकामध्ये myCounter css काउंटर रीसेट करते
     .
     1. counter-increment: myCounter;- प्रत्येक छद्म घटकासाठी css काउंटर myCounter वाढवते::before.
     2. सामग्री:काउंटर(माय काउंटर);- मायकाउंटर काउंटरचे वर्तमान मूल्य::स्यूडो-एलिमेंटच्या आत प्रिंट करते.

   सीएसएस काउंटरबद्दल अधिक तपशील येथे आढळू शकतात

   ज्याच्या निर्मितीबद्दलच्या याद्यांसाठी HTML वापरूनयेथे वर्णन केलेले, खालील CSS नियम दिले आहेत.

   सूची-शैली-प्रकार

   एचटीएमएल कोडमध्ये टाइप विशेषता ऐवजी बुलेट किंवा सूची क्रमांकन निर्दिष्ट करते. बुलेट केलेल्या सूचीसाठी मालमत्ता मूल्ये असू शकतात:

   • डिस्क- मंडळ, डीफॉल्टनुसार सेट करा.
   • वर्तुळ- मंडळ.
   • चौरस- चौरस.

   क्रमांकित सूचीसाठी, मालमत्तेला सहसा खालील मूल्ये नियुक्त केली जातात:

   • दशांश- अरबी अंक, डीफॉल्ट मूल्य.
   • लोअर-रोमन- लहान रोमन अंक.
   • अप्पर-रोमन- कॅपिटल रोमन अंक.
   • लोअर-अल्फा- लोअरकेस लॅटिन अक्षरे.
   • अप्पर-अल्फा- कॅपिटल लॅटिन अक्षरे.

   तसेच, कोणत्याही सूची प्रकारासाठी, सूची-शैली-प्रकार गुणधर्म काहीही वर सेट केले जाऊ शकतात, जे मार्कर पूर्णपणे काढून टाकेल.

   इतर मूल्ये क्रमांकित सूचीसाठी उपलब्ध आहेत, जसे की cjk-वैचारिकवैचारिक क्रमांकन सेट करते, आर्मेनियन- पारंपारिक आर्मेनियन, आणि दशांश-अग्रणी-शून्यरोमन अंकांमध्ये क्रमांकन सेट करेल, परंतु अग्रगण्य शून्यासह: 01, 02, 03... 09, तथापि व्यवहारात ही आणि तत्सम मूल्ये अत्यंत क्वचितच वापरली जातात.

   खालील उदाहरण तीन याद्या दाखवते: पारंपारिक आर्मेनियन क्रमांकासह क्रमांकित सूची, वर्तुळासह बुलेट केलेली सूची आणि वैचारिकदृष्ट्या क्रमांकित आयटम असलेली क्रमांकित सूची.

   1. पहिला मुद्दा
   2. दुसरा मुद्दा
   3. तिसरा मुद्दा
   • पहिला मुद्दा
   • दुसरा मुद्दा
   • तिसरा मुद्दा
   1. पहिला मुद्दा
   2. दुसरा मुद्दा
   3. तिसरा मुद्दा

   परिणाम.

   मार्करचा रंग मालमत्तेद्वारे निर्दिष्ट केलेल्या सूचीमधील मजकूराच्या रंगाशी जुळतो रंग.

   सूची-शैली-प्रतिमा

   तुम्हाला तुमची स्वतःची प्रतिमा सूची मार्कर म्हणून सेट करण्याची अनुमती देते. उदाहरणार्थ, सूची पृष्ठ असलेल्या फोल्डरमध्ये फाइल असल्यास marker.png, जो तुम्हाला वापरायचा आहे, तर डिझाईन कोड खालीलप्रमाणे असेल:

   Ul ( सूची-शैली-प्रतिमा: url("marker.png"); )

   सूची-शैली-स्थिती

   मार्करची स्थिती निश्चित करते: एकतर ते सूची घटकाच्या सीमेबाहेर ठेवलेले असते ( सूची-शैली-स्थिती: बाहेर), किंवा मजकूर त्याच्याभोवती गुंडाळतो ( सूची-शैली-स्थिती: आत).

   खालील उदाहरण या मूल्यांमधील फरक दर्शविते. पहिल्या प्रकरणात, मार्कर सूचीच्या आत आहे, दुसऱ्या प्रकरणात, ते सूचीच्या बाहेर ठेवले आहे.

   • फक्त आत आणि बाहेरचा फरक पहा.
   • आतल्या बाबतीत, मार्कर त्याच्या सीमांच्या पलीकडे न जाता आणि लेआउटमध्ये हस्तक्षेप न करता थेट सूचीमध्ये बसतो. मजकूर त्याच्याभोवती वाहतो, मार्कर आत असल्याचे दिसते.
   • बाहेरील मूल्य मार्करला सूचीच्या बाहेर हलवते.

   परिणामी, खालील पृष्ठ तयार केले आहे:

   

   सूची-शैली

   एका ओळीत सर्व तीन सूचीबद्ध गुणधर्म लिहून तुम्हाला तुमचा कोड लहान करण्याची अनुमती देते. नियम रिक्त स्थानांद्वारे विभक्त केले जातात:

   Ul (सूची-शैली: आत चौरस;)

   तीन सूची असलेल्या पानाचे उदाहरण पाहू. प्रथम क्रमांक 01, 02 मधील क्रमांकासह, दुसरा सानुकूल चित्राने चिन्हांकित केला आहे (पृष्ठासह फोल्डरमध्ये marker.png फाइल), तिसऱ्या सूचीचा मार्कर अक्षम केला आहे.

   HTML कोड खाली दिलेला आहे.

   1. पहिला मुद्दा
   2. दुसरा मुद्दा
   3. तिसरा मुद्दा
   • पहिला मुद्दा
   • दुसरा मुद्दा
   • तिसरा मुद्दा
   1. पहिला मुद्दा
   2. दुसरा मुद्दा
   3. तिसरा मुद्दा

   ब्राउझर खालील पृष्ठ प्रदर्शित करेल.