Ticker

6/recent/ticker-posts

Advertisement

How to Apply aside tag in HTML Web Pages (HTML Web Pages में aside tag कैसे Apply करे) ( Web Designing series Part-27 )

  HTML Web Pages में aside tag कैसे Apply करे 




  • ये web designing series का part-27 है आज के इस article में हम पढने वाले है की किसी website के web pages में <aside> tag कैसे apply करते है और इसको क्यों apply किया जाता है |<aside > tag को HTML web pages कैसे use करेगे ये जानने से पहले हम आपको बता दे   की अगर आप इस article पर पहली बार आये है तो इस को पढने से पहले web designing series के पिछले सभी parts को जरूर पढ़े तभी आपको ये article समझ में आयेगा |
  • आपको web designing series के  पिछले सभी parts पढने के लिए आपको हमारे वेबसाइट के menu baar में जाना होगा जहा web designing series का dropdown देखने को मिलेगा उसी dropdown के अन्दर html के सभी parts के link देखने को मिलेगे  वहा से आप सभी पिछले parts detail में पढ़ सकते है |अब बिना वक्त गवाए आज के topic को शुरू करते है


<aside> tag की कोडिंग  html web pages में  कैसे और क्यों की जाती है |

  1. <aside> tag का use किसी भी website के web pages के   article  में दी हुयी जानकारी को highlight करने के लिए किया जाता है <aside> tag का use लगभग प्रत्येक website में होता है <aside> tagके use से एक Normal सी website एक professional website जैसी प्रतीत होती है | इसलिए <aside> tag एक important tag है जिसका प्रयोग आपको अच्छी तरह से आना चाहिए |
  2. आपने ज्यादातर websites में देखा होगा की किसी भी website के articles के अन्दर जो भी जानकारी दी हुयी होती है उसी जानकारी से सम्बंधित article उसी website के web page के side में कुछ articles highlight होते है जो उस website की lattest जानकारी देते रहते है |ऐसे ही highlighted articles <aside> tagकी मदद से बनाए जाते है इसको हम निचे example में समझेगे और इसको निचे दिए विडियो में practically भी समझेगे जिससे आपको अच्छी तरह से <aside> tag clear हो जाएगा |
  3. <aside> tag की कोडिंग <body> tag के अन्दर ही की जाती है <aside> tag के opening और closing दोनों tag होते है |
  4. <aside> tag को HTML web pages में apply करने के लिए थोड़ी css की properties  भी use करनी पड़ती है जिसे देखकर आपको confuse नही होना है <aside> tag में जितनी भी css use हो  उतनी आपको कर लेनी है | बाकी आने वाली css classes में हम css की सारी Properties detail में पढेगे |
  5. <aside> tag की कोडिंग करने के बाद हमारा HTML web page कुछ इस इमेज की तरह   दिखाई देगा इस web page की कोडिंग निचे example में की गयी है और इसका निचे विडियो भी दिया गया है जिसको आप देखे और समझे | और स्वयं इसका practical करे | इस इमेज को क्लिक करे और फिर देखे तभी आपको इमेज में दिया हुवा  text समझ आयेगा|  
    <aside> tag example image

  6. <aside> tag को एक Example की मदद से समझते है |

Example-:

<body>

<article style="width:65%; float: left; padding:10px; ">

<h1> what is computer </h1>

<p>

A computer is a machine that can be instructed to carry out sequences of arithmetic or logical operations automatically via computer programming. Modern computers have the ability to follow generalized sets of operations, called programs.

</p>

</article>

<aside style=" width:25%; float: left; padding: 10px; background-color: gray; color: white;">

<h1> Laptop </h1>

<p>

A laptop or laptop computer, is a small, portable personal computer with a "clamshell" form factor, typically having a thin LCD or LED computer screen mounted on the inside of the upper lid of the clamshell and an alphanumeric keyboard on the inside of the lower lid. The clamshell is opened up to use the computer

</p>

</aside>

</body>

  • जैसा आपने example में देखा की <aside> tag की कोडिंग कैसे करनी है और इस example में जितनी भी css की properties use की गयी है इन्हें देखकर आपको confuse नहीं होना है |
  • अगर हम <aside> tag में css की properties use नहीं करेगे तो <aside> tag work नहीं करेगा इसलिए  जितनी properties use की गयी है  उतनी properties आपको भी use कर लेनी है बाकी आने वाली articles में   html ख़तम होने बाद हम css को detail में पढेगे |
  • <aside> tag को इस विडियो में practically बताया गया है इसलिए इसे जरूर देखे और इसका practical करे |


  • अब आपको <aside> tag अच्छी तरह समझ आ गया होगा अगर आपको कोई doubt है तो comment करके पूछ सकते है या फिर वेबसाइट पर दिए social icon पर हमें direct message कर सकते है जिसका reply आपको तुरंत मिलेगा | आज के लिए इतना ही मिलते है अब अगले article में |


            

Post a Comment

0 Comments