एचटीएमएल <article> टैग

  • पिछला पृष्ठ <area>
  • अगला पृष्ठ <aside>

वर्णन और उपयोग

<article> टैग एक स्वतंत्र और स्वयं अंतर्निहित सामग्री को निर्धारित करता है。

एक लेख स्वतंत्र रूप से समझा जाने वाला होना चाहिए और पूरे साइट से स्वतंत्र रूप से वितरित किया जाना चाहिए。

<articel> एलीमेंट के संभावित स्रोतों में शामिल है:

  • फोरम पोस्ट
  • ब्लॉग आलेख
  • समाचार रिपोर्ट
  • उपयोगकर्ता टिप्पणी

ध्यान दें:ब्राउज़र में<article> एलीमेंट स्वयं विशेष स्टाइल नहीं प्रस्तुत करता है। लेकिन, आप CSS स्टाइल का उपयोग कर सकते हैं <article> एलीमेंट (नीचे के उदाहरण को देखें)।

दूसरे संदर्भ:

HTML DOM संदर्भ पुस्तक:Article ऑब्जैक्ट

उदाहरण

उदाहरण 1

तीन अलग-अलग, स्वतंत्र और स्वयं परिस्थिति वाले लेख:

<article>
<h2>गूगल क्रोम</h2>
<p>गूगल क्रोम गूगल द्वारा विकसित एक वेब ब्राउज़र है, जो 2008 में जारी किया गया था। क्रोम आज के दिनों में सबसे लोकप्रिय वेब ब्राउज़र है!</p>
<p>Microsoft Edge माइक्रोसॉफ्ट द्वारा विकसित एक नेटवर्क ब्राउज़र है, जो 2015 में जारी किया गया था। Microsoft Edge Internet Explorer की जगह ले रहा है。</p>
<article>
<h2>मोजिला फायरफॉक्स</h2>
<p>मोजिला फायरफॉक्स मोजिला द्वारा विकसित एक खुला स्रोत वेब ब्राउज़र है। 2018 जनवरी से, फायरफॉक्स दूसरा सबसे लोकप्रिय वेब ब्राउज़र रहा है。</p>
<p>Microsoft Edge माइक्रोसॉफ्ट द्वारा विकसित एक नेटवर्क ब्राउज़र है, जो 2015 में जारी किया गया था। Microsoft Edge Internet Explorer की जगह ले रहा है。</p>
<article>

Microsoft Edge

<h2>Microsoft Edge</h2>
<p>Microsoft Edge माइक्रोसॉफ्ट द्वारा विकसित एक नेटवर्क ब्राउज़र है, जो 2015 में जारी किया गया था। Microsoft Edge Internet Explorer की जगह ले रहा है。</p>

</html>

उदाहरण 2

CSS के द्वारा <article> एलीमेंट के स्टाइल सेट करें:

<html>
<head>
<style>
.all-browsers {
  margin: 0;
  padding: 5px;
  background-color: lightgray;
}
.all-browsers > h1, .browser {
  margin: 10px;
  padding: 5px;
}
.browser {
  background: white;
}
.browser > h2, p {
  margin: 4px;
  font-size: 90%;
}
</style>
</head>
<body>
<article class="all-browsers">
  <h1>सबसे लोकप्रिय ब्राउज़र</h1>
  <article class="browser">
    <h2>गूगल क्रोम</h2>
    <p>गूगल क्रोम गूगल द्वारा विकसित एक वेब ब्राउज़र है, जो 2008 में जारी किया गया था। क्रोम आज के दिनों में सबसे लोकप्रिय वेब ब्राउज़र है!</p>
  <p>Microsoft Edge माइक्रोसॉफ्ट द्वारा विकसित एक नेटवर्क ब्राउज़र है, जो 2015 में जारी किया गया था। Microsoft Edge Internet Explorer की जगह ले रहा है。</p>
  <article class="browser">
    <h2>मोजिला फायरफॉक्स</h2>
    <p>मोजिला फायरफॉक्स मोजिला द्वारा विकसित एक खुला स्रोत वेब ब्राउज़र है। 2018 जनवरी से, फायरफॉक्स दूसरा सबसे लोकप्रिय वेब ब्राउज़र रहा है。</p>
  <p>Microsoft Edge माइक्रोसॉफ्ट द्वारा विकसित एक नेटवर्क ब्राउज़र है, जो 2015 में जारी किया गया था। Microsoft Edge Internet Explorer की जगह ले रहा है。</p>
  <article class="browser">
    
Microsoft Edge

    <h2>Microsoft Edge</h2>
  <p>Microsoft Edge माइक्रोसॉफ्ट द्वारा विकसित एक नेटवर्क ब्राउज़र है, जो 2015 में जारी किया गया था। Microsoft Edge Internet Explorer की जगह ले रहा है。</p>
<p>Microsoft Edge माइक्रोसॉफ्ट द्वारा विकसित एक नेटवर्क ब्राउज़र है, जो 2015 में जारी किया गया था। Microsoft Edge Internet Explorer की जगह ले रहा है。</p>
</article>
</body>

</html>

अपने आप से प्रयास करें

<article> टैग इवेंट प्रकृति का समर्थन करती है वैश्विक गुण।

HTML में वैश्विक गुण

<article> टैग इवेंट प्रकृति का समर्थन करती है HTML में इवेंट प्रकृति।

डिफ़ॉल्ट CSS सेटिंग

अधिकांश ब्राउज़र निम्नलिखित डिफ़ॉल्ट मूल्यों के साथ प्रदर्शित करेंगे <article> तत्व:

article {
  display: block;
}

ब्राउज़र समर्थन

तालिका में दिए गए नंबर इस तत्व को पूरी तरह से समर्थन देने वाले पहले ब्राउज़र का संस्करण है。

च्रोम एज फायरफॉक्स सफारी ओपेरा
च्रोम एज फायरफॉक्स सफारी ओपेरा
6.0 9.0 4.0 5.0 11.1
  • पिछला पृष्ठ <area>
  • अगला पृष्ठ <aside>