Ticker

6/recent/ticker-posts

Advertisement

How to Apply List in HTML Web Pages ( HTML Web Pages में list कैसे बनाए ) ( Web Designing series Part-22 )

   HTML Web Pages में list कैसे बनाए




  • ये Web Designing series का Part-21 चल रहा है आज के इस article में हम पढने वाले है की वेब पेजेज में कोई list कैसे apply करते अर्थात किसी hedding या paragraph को हम numbering कैसे देगे | चाहे 1,2 ,3 करके हो या फिर a ,b ,c करके हो या चाहे roman no. में numbering देनी हो | क्योकि  किसी भी वेबसाइट के web pages को खूबसूरती देने के लिए वेबसाइट में दी हुयी जानकारी एक सही और व्यवस्थित तरीके से होनी चाहिए इसके लिए हमें list बनाने की knowledge होनी चाहिए तो आज के article में हम यही पढने वाले है तो चलिए बिना वक्त गवाए शुरू करते है |हमारे list कैसी देखेगी apply करने पर उसकी इमेज निचे दी हुयी है |



List tag 

  • list tag तीन प्रकार के होते है 

  1. Unordered List
  2. Ordered List
  3. Description List

  • चलिए हम तीनो के बारे में विस्तार पूर्वक और example के साथ समझते है 


Unordered List

  • जब हम किसी article के hedding  या paragraph या किसी के नामो की एक list हो उनको व्यवस्थित रूप देने के लिए  एक bullet की जरूरत पड़ती है bullet का मतलब होता है एक icon जिसका sign circle , square , या disk की तरह हो जो हमारे hedding या paragraph के पहले दिखना चाहिए इसका कोई order नही होता इसलिए इसे Unordered list कहते जो हमारे hedding या paragraph के पहले एक icon की तरह शो  होता है  Unordered list apply करने के लिए <ul> tag की जरूरत होती है इसे हम body tag के अन्दर ही इस्तेमाल करते है क्योकि सारा डाटा जो भी हम वेब पेजेज के अन्दर देखाते है उसकी कोडिंग body tag के अन्दर ही होती है इसका भी opening और closing tag होता है  | चलिए इसे example की मदद से समझते है और इसे practically समझने के लिए निचे विडियो दिया गया है  उसे भी देखियेगा |
  • <ul> tag के अन्दर <li> tag का use करना होता है इस tag को भी open और close tag के अन्दर रखना होता है किसी भी नाम या hedding को unordered list में रखने के लिए use <li > tag के अन्दर रखना होगा समझने के लिए  example में देखिये |

Example-:

<ul> style="list-style: disk/circle/square/none">

<li>Amit</li>                                                                                                                                                 <li>Vishu</li>                                                                                                                                                <li>Praveen</li>

</ul>

Ordered List

  • जब हम किसी hedding या paragraph को व्यवस्थित तरीके से एक बढ़ते हुए क्रम में लिखना चाहते है तब हम ordered list का इस्तेमाल करते है बढ़ते हुए क्रम में संख्या हो या a ,b ,c d(Consonent) हो या फिर रोमन संख्या हो इन सभी को किसी hedding या paragraph में apply करने के लिए ordered list का use करते है ordered list apply करने के लिए <ol> tag का इस्तेमाल करते है इसका भी opening और closing tag होता है
  • किसी भी नाम , hedding या paragraph को ordered list देने के लिए नाम , hedding या paragraph को   <li> tag के अन्दर रखना होगा इसे मैं पहले भी बता चुका हु इसमें भी हम <li> tag को open और close tag के अन्दर रखेगे चलिए इसे भी example में समझते है | और निचे दिए विडियो में भी देखिएगा तभी आपको clear समझ में आयेगा |

Example-:

<ol  type="A/a/i/I>

<li>Amit</li>                                                                                                                                                 <li>Vishu</li>                                                                                                                                                <li>Praveen</li>

</ol>

Description List

  • किसी विशेष नाम या hedding को Explain करने के लिए हम discription list का इस्तेमाल करते है discription list को apply करने के लिए <dl> tag का इस्तेमाल करते है <dl> tag के अन्दर <dt> tag और <dd>tag को apply करते है जिस नाम या हेडिंग के बारे में explain करना हो उस नाम को <dt> tag के अन्दर लिखते है इसको भी हम  हम open और close tag देते है और उसी नाम या हेडिंग के बारे में जो भी हम लिखेगे उसे हम <dd> tag के अन्दर रखेगे <dd> tag को भी हम open और close tag देगे चलिए इन सभी को एक example की मदद से समझते है |

Example-:

<dl>

<dt> India </dt>                                                                                                                                              <dd> India is a great country </dd>

</dl>


  • यहाँ पर मैंने तीनो list के बारे में example के साथ बताया है अब आप इन सभी को विडियो में भी देखिये जो निचे निचे दिया हुआ है विडियो में देखकर आप भी अपने कंप्यूटर या लैपटॉप में इसका practical कर पायेगे तो निचे दिए विडियो को जरूर देखिएगा आज के इतना ही मिलते है article में |


अगर आप हमारे article पर पहली बार आये है तो हमें फॉलो करिए और इस वेब डिजाइनिंग series को join कर ले अगर आप इसमें interested है अगर आप कोई प्रश्न पूछना चाहते है तो comment box में comment करे


   html वेब पेजेज में list कैसे लगाए क्लिक विडियो  

                             









Post a Comment

0 Comments