সিএসএস list-style প্রোপার্টি
ব্রাউজার সাপোর্ট
| property | Google Chrome | Edge | Mozila Firefox | Safari | Opera |
|---|---|---|---|---|---|
| list-style | ১.০ | ৪.০ | ১.০ | ১.০ | ৭.০ |
সংজ্ঞা ও ব্যবহার
একটি ডিক্লেয়ারশনে সবগুলো লিস্ট প্রোপার্টি নির্ধারন করা হয়।
list-style-type, list-style-position এবং list-style-image ক্রমানুসারে নির্ধারন করা হয়।
উপরের একটা ভ্যালু যদি বাদ যায় তবে সে ডিফল্ট আকারে একটা ভ্যালু নিয়ে যাবে।
| Initial Value: | Inherited: | Animatable: |
|---|---|---|
| none | হ্যাঁ | না। আরোও জানতে animatable অধ্যায় ভিজিট করুন। |
সিএসএস সিনট্যাক্স
list-style: list-style-type list-style-position list-style-image/initial/inherit;
একটি ডিক্লেয়ারেশনে সবগুলো লিস্ট প্রোপার্টি নির্ধারন করা হয়।
উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<style>
ul {
list-style: square url("../cssref_examples/listimg.png");
}
</style>
</head>
<body>
<ul>
<li>কফি</li>
<li>চা</li>
<li>কোকা কোলা</li>
</ul>
</body>
</html>
ফলাফল
জাভাস্ক্রিপ্ট সিনট্যাক্স
object.style.listStyle="decimal inside"উদাহরণ
<!DOCTYPE html>
<html>
<head>
<p> লিস্টের স্টাইল পরিবর্তন করার জন্য "Try" বাটন ক্লিক করুন।</p>
<button onclick="myFunction()">Try</button>
<ul id="listStyle">
<li>ই-মেইল</li>
<li>টোবিয়াস</li>
<li>লিনাস</li>
</ul>
<script>
function myFunction() {
document.getElementById("listStyle").style.listStyle = "decimal inside";
}
</script>
</body>
</html>
ফলাফল
list-style প্রোপার্টির ভ্যালু-সমূহ
- list-style-type - list-item marker দিয়ে type নির্ধারন করা হয়। দেখুন list-style-type সম্ভাব্য ভ্যালুর জন্য।
- list-style-position -list-item marker কোথায় বসবে তা নির্ধারন করে। দেখুন list-style-position সম্ভাব্য ভ্যালুর জন্য।
- list-style-image -list-item marker দিয়ে image নির্ধারন করা হয়। দেখুন list-style-image সম্ভাব্য ভ্যালুর জন্য ।
- initial - সিএসএস প্রোপার্টির ডিফল্ট ভ্যালু সেট করে। আরও জানতে initial অধ্যায় ভিজিট করুন।
- inherit - এই প্রোপার্টির ভ্যালু প্যারেন্ট এলিমেন্ট থেকে উত্তরাধিকার সূত্রে পায়। আরও জানতে inherit অধ্যায় ভিজিট করুন।