CSS কাউন্টার-সেট প্রতিশব্দ

সংজ্ঞা ও ব্যবহার

counter-set এই অ্যাট্রিবিউটটি ক্ষুদ্র গণনা তৈরি করতে এবং CSS গণনা সংযোজিত করতে ব্যবহৃত হয়。

counter-set এই অ্যাট্রিবিউটটি counter-increment এবং content অ্যাট্রিবিউটের সাথে সাধারণত ব্যবহার করা হয়。

প্রকল্প

উদাহরণ 1

একটি কাউন্টার ("my-counter") তৈরি করা, 5-এ তা সংযোজিত করা এবং প্রতিবার <h2> সিলেক্টর ব্যবহার করার সময় তা বাড়ানো:

body {
  /* "my-counter"-কে 5-এ সংযোজিত করা */
  counter-set: my-counter 5;
}
h2::before {
  /* "my-counter"-এর মান 1 বাড়ানো */
  counter-increment: my-counter;
  content: "Section " counter(my-counter) ". ";
}

আপনার হাতে পরীক্ষা করুন

উদাহরণ 2

একটি কাউন্টার ("my-counter") তৈরি করা, 5-এ তা সংযোজিত করা এবং প্রতিবার <h2> সিলেক্টর ব্যবহার করার সময় তা কমানো:

body {
  /* "my-counter"-কে 5-এ সংযোজিত করা */
  counter-set: my-counter 5;
}
h2::before {
  /* "my-counter"-কে 1-এ কমানো */
  counter-increment: my-counter -1;
  content: "Section " counter(my-counter) ". ";
}

আপনার হাতে পরীক্ষা করুন

উদাহরণ 3

সেকশন এবং সাব-সেকশন সংখ্যায়নের জন্য "Section 10:"、"10.1"、"10.2" ইত্যাদির ফরম্যাট ব্যবহার করা:

body {
  /* "section"-কে 9-এ সংযোজিত করা */
  counter-set: section 9;
}
h1 {}}
  /* "subsection"-এর মান 0 করা হবে */
  counter-set: subsection 0;
}
h1::before {
  /* "section"-এর মান 1 বাড়ানো */
  counter-increment: section;
  content: "Section " counter(section) ": ";
}
h2::before {
  /* "subsection"-এর মান 1 বাড়ানো */
  counter-increment: subsection;
  content: counter(section) "." counter(subsection) " ";
}

আপনার হাতে পরীক্ষা করুন

উদাহরণ 4

একটি কাউন্টার তৈরি করুন, তার মান 9 করা হবে, এবং প্রতিটি <h2> চিহ্ন এবং সংস্থান করা হবে (রোমান সংখ্যা):

body {
  /* "my-counter"-এর মান 9 করা হবে */
  counter-set: my-counter 9;
}
h2::before {
  /* "my-counter"-এর মান 1 বাড়ানো */
  counter-increment: my-counter;
  content: counter(my-counter, upper-roman) ". ";
}

আপনার হাতে পরীক্ষা করুন

CSS ভাষা

counter-set: none|counter-name number|initial|inherit;

প্রক্রিয়াতি মান

ব্রাউজার সমর্থন

টেবিলের সংখ্যা এই প্রক্রিয়াটি সম্পূর্ণরূপে সমর্থনকারী প্রথম ব্রাউজার সংস্করণটি উল্লেখ করে।

সংক্রান্ত পৃষ্ঠা

উল্লেখ:::before মিথ্যা ইলেক্ট্রন

উল্লেখ:::after মিথ্যা ইলেক্ট্রন

উল্লেখ:CSS কনটেন্ট প্রতিশব্দ

উল্লেখ:CSS কাউন্টার-ইনক্রিমেন্ট প্রতিশব্দ

উল্লেখ:CSS counter() ফাংশন