HTML <ul> टैग

  • पिछला पृष्ठ <u>
  • अगला पृष्ठ <var>

निर्धारण और उपयोग

<ul> टैग का उपयोग करके अनवरणीय (बिन्दुओं सहित) सूची निर्धारित करें।

इस्तेमाल करें <ul> टैग और <li> टैग का उपयोग करके अनवरणीय सूची बनाएं।

सूचना:CSS का उपयोग करकेसूची शैली सेट करें。

सूचना:क्रमवार सूची के लिए, इस्तेमाल करें <ol> टैग。

और देखें:

HTML शिक्षण:HTML सूची

HTML DOM संदर्भ निर्देशिका:Ul ऑब्जेक्ट

CSS शिक्षण:सूची की शैली सेट करें

उदाहरण

उदाहरण 1

एक अनवरणीय HTML सूची:

<ul>
  <li>कॉफी</li>
  <li>चाय</li>
  <li>दूध</li>
</ul>

खुद से प्रयोग करें

उदाहरण 2

विभिन्न सूची शैली तरीके सेट करें (CSS का उपयोग करके):

<ul style="list-style-type:circle">
  <li>कॉफी</li>
  <li>चाय</li>
  <li>दूध</li>
</ul>
<ul style="list-style-type:disc">
  <li>कॉफी</li>
  <li>चाय</li>
  <li>दूध</li>
</ul>
<ul style="list-style-type:square">
  <li>कॉफी</li>
  <li>चाय</li>
  <li>दूध</li>
</ul>

खुद से प्रयोग करें

उदाहरण 3

सूची में लाइन-हाइट को बढ़ाएं और कम करें (CSS का उपयोग करके):

<ul style="line-height:180%">
  <li>कॉफी</li>
  <li>चाय</li>
  <li>दूध</li>
</ul>
<ul style="line-height:80%">
  <li>कॉफी</li>
  <li>चाय</li>
  <li>दूध</li>
</ul>

खुद से प्रयोग करें

उदाहरण 4

सूची में एक और सूची बनाएं (निहार्य सूची):

<ul>
  <li>कॉफी</li>
  <li>चाय</li>
    <ul>
      <li>पूएर</li>
      <li>लीग्स</li>
    </ul>
  </li>
  <li>दूध</li>
</ul>

खुद से प्रयोग करें

उदाहरण 5

एक अधिक जटिल निहार्य सूची बनाएं:

<ul>
  <li>कॉफी</li>
  <li>चाय</li>
    <ul>
      <li>पूएर</li>
      <li>ग्रीन चाय</li>
        <ul>
          <li>बीलूचून</li>
          <li>लूंगजिंग</li>
        </ul>
      </li>
    </ul>
  </li>
  <li>दूध</li>
</ul>

खुद से प्रयोग करें

ग्लोबल प्रकृति

<ul> टैग इवेंट प्रकृति का समर्थन करता है HTML में ग्लोबल प्रकृति。

इवेंट प्रकृति

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

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

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

ul {
  display: block;
  list-style-type: disc;
  margin-top: 1em;
  margin-bottom: 1 em;
  margin-left: 0;
  margin-right: 0;
  padding-left: 40px;
}

खुद से प्रयोग करें

ब्राउज़र सहायता

च्रोम एज फायरफॉक्स सफारी ओपेरा
च्रोम एज फायरफॉक्स सफारी ओपेरा
सापोर्ट सापोर्ट सापोर्ट सापोर्ट सापोर्ट
  • पिछला पृष्ठ <u>
  • अगला पृष्ठ <var>