CSS
सूची शैलियाँ

वाक्य - विन्यास

• सूची-शैली: सूची-शैली-प्रकार | सूची-शैली-स्थिति | सूची-शैली-छवि | प्रारंभिक | वारिस;

पैरामीटर

टिप्पणियों

बुलेट या नंबरिंग का प्रकार

विशिष्ट सूची के भीतर <li> टैग के लिए विशिष्ट: ( <ul> ):

list-style: disc;                /* A filled circle (default) */
list-style: circle;              /* A hollow circle */
list-style: square;              /* A filled square */
list-style: '-';                 /* any string */

एक आदेशित सूची के भीतर <li> टैग के लिए विशिष्ट ( <ol> ):

list-style: decimal;             /* Decimal numbers beginning with 1 (default) */
list-style: decimal-leading-zero;/* Decimal numbers padded by initial zeros (01, 02, 03, … 10) */
list-style: lower-roman;         /* Lowercase roman numerals (i., ii., iii., iv., ...) */
list-style: upper-roman;         /* Uppercase roman numerals (I., II., III., IV., ...) */
list-style-type: lower-greek;    /* Lowercase roman letters (α., β., γ., δ., ...) */
list-style-type: lower-alpha;    /* Lowercase letters (a., b., c., d., ...) */
list-style-type: lower-latin;    /* Lowercase letters (a., b., c., d., ...) */
list-style-type: upper-alpha;    /* Uppercase letters (A., B., C., D., ...) */
list-style-type: upper-latin;    /* Uppercase letters (A., B., C., D., ...) */

गैर विशिष्ट:

list-style: none;                /* No visible list marker */
list-style: inherit;             /* Inherits from parent */

बुलेट की स्थिति

एक सूची में <li> तत्व होते हैं जिसमें एक तत्व होता है ( <ul> या <ol> )। दोनों सूची आइटम और कंटेनर में मार्जिन और पेडिंग हो सकते हैं जो दस्तावेज़ में सूची आइटम सामग्री की सटीक स्थिति को प्रभावित करते हैं। मार्जिन और पैडिंग के लिए डिफ़ॉल्ट मान प्रत्येक ब्राउज़र के लिए भिन्न हो सकते हैं। समान लेआउट क्रॉस-ब्राउज़र प्राप्त करने के लिए, इन्हें विशेष रूप से सेट करने की आवश्यकता है।

प्रत्येक सूची आइटम में एक 'मार्कर बॉक्स' होता है, जिसमें बुलेट मार्कर होता है। यह बॉक्स या तो सूची आइटम बॉक्स के अंदर या बाहर रखा जा सकता है।

list-style-position: inside;

बुलेट को <li> तत्व के भीतर रखता है, सामग्री को आवश्यकतानुसार दाईं ओर धकेलता है।

list-style-position: outside;

गोली <li> तत्व के बाईं ओर स्थित है। यदि युक्त तत्व की गद्दी में पर्याप्त स्थान नहीं है, तो मार्कर बॉक्स बाईं ओर विस्तारित होगा, भले ही वह पृष्ठ से गिर जाए।

inside और outside स्थिति का परिणाम दिखाना: jsfiddle

बुलेट / नंबर निकालना

कभी-कभी, एक सूची में केवल किसी भी बुलेट पॉइंट या संख्या को प्रदर्शित नहीं किया जाना चाहिए। उस स्थिति में, मार्जिन और पैडिंग निर्दिष्ट करना याद रखें।

<ul>
    <li>first item</li>
    <li>second item</li>
</ul>

सीएसएस

ul {
    list-style-type: none;
}
li {
    margin: 0;
    padding: 0;
}