आज इस आर्टिकल में हम आपको CSS List Tutorial in Hindi – Part 14 के बारे में बताने जा रहे है.

List के बारे में हमने HTML के list tutorial में पढ़ा था. हमने वहां पर दो तरह की लिस्ट के बारे में पढ़ा था 1 order list और दूसरा unorder list.
CSS की मदद से हम marker के स्टाइल को change कर सकते है और इसके अलावा और भी बहुत से बदलाव कर सकते है जिसके बारे में हम आपको इस आर्टिकल में बताएँगे.
list-style-type
इसकी मदद से हम किसी भी order लिस्ट को या unorder लिस्ट के marker को change कर सकते है.
ul.circle {
list-style-type: circle;
}
ul.square {
list-style-type: square;
}
ol.uroman {
list-style-type: upper-roman;
}
ol.alpha {
list-style-type: lower-alpha;
}
ul.none {
list-style-type: none;
}
list-style-image
इसकी मदद से हम किसी भी marker की जगह पर हम कोई फोटो भी सेट कर सकते है जैसे कोई arrow picture.
ul {
list-style-image: url('sqpurple.gif');
}
list-style-position
अगर हम marker की पोजीशन को outside या inside सेट कर सकते है. जैसे मान लो हमने किसी टेबल के अन्दर कोई लिस्ट बनाई है जिसका marker हम टेबल के अन्दर ही रखना चाहते है तब हम list-style-position का इस्तेमाल करेंगे.
ul.outside {
list-style-position: outside;
}
ul.inside {
list-style-position: inside;
}
इस प्रकार हम किसी भी लिस्ट की styling को बदल सकते है. आगे के टुटोरिअल से हम आपको बताएँगे की कैसे आप लिस्ट की मदद से एक Menu Bar बना सकते है.
Leave a Reply