CSS কম্বিনেশন

CSS কম্বিনেশন

কম্বিনেশন একটি পছন্দকারীগুলির মধ্যে সম্পর্ক বুঝানোর একটি পদ্ধতি।

CSS পছন্দকারীগুলি একাধিক সাধারণ পছন্দকারীকে অন্তর্ভুক্ত করতে পারে। সাধারণ পছন্দকারীগুলির মধ্যে, আমরা একটি কম্বিনেশন অন্তর্ভুক্ত করতে পারি।

CSS-এর মধ্যে চারটি ভিন্ন কম্বিনেশন রয়েছে:

  • সমস্তকালীন পছন্দকারী (সমস্তকালীন)
  • সাবমেলেট পছন্দকারী (>)
  • আড়ালা ভাইস পছন্দকারী (+)
  • সাধারণ ভাইস পছন্দকারী (~)

সমস্তকালীন পছন্দকারী

সমস্তকালীন পছন্দকারী একটি নির্দিষ্ট মেলেটের সমস্তকালীন সমস্তকালীন মেলেটকে মিলিয়ে দেয়。

নিচের উদাহরণটি অবস্থানকারী <div> মেলেটের ভিতরের সকল <p> মেলেট নির্বাচন করে:

উদাহরণ

div p {
  background-color: yellow;
}

আপনার নিজেই প্রয়োগ করুন

সাবমেলেট পছন্দকারী

সাবমেলেট পছন্দকারী একটি নির্দিষ্ট মেলেটের সমস্তকালীন সাবমেলেটকে মিলিয়ে দেয়。

নিচের উদাহরণটি অবস্থানকারী <div> মেলেটের সমস্ত সাবমেলেট <p> মেলেট নির্বাচন করে:

উদাহরণ

div > p {
  background-color: yellow;
}

আপনার নিজেই প্রয়োগ করুন

আড়ালা ভাইস পছন্দকারী

আড়ালা ভাইস পছন্দকারী একটি নির্দিষ্ট মেলেটের সমস্তকালীন আড়ালা সমস্তকালীন মেলেটকে মিলিয়ে দেয়。

ভাইস (সমস্তকালীন) মেলেটগুলির পিতৃপিতৃকালীন মেলেটকে সমস্তকালীন মেলেটকে মিলিয়ে দেয়। “আড়ালা” এর অর্থ “পরেরদিকে”।

নিচের উদাহরণটি অবস্থানকারী <div> মেলেটের পরের সমস্ত <p> মেলেট নির্বাচন করে:

উদাহরণ

div + p {
  background-color: yellow;
}

আপনার নিজেই প্রয়োগ করুন

সাধারণ ভাইস পছন্দকারী

সাধারণ ভাইস পছন্দকারী একটি নির্দিষ্ট মেলেটের সমস্তকালীন মেলেটকে মিলিয়ে দেয়。

নিচের উদাহরণটি অবস্থানকারী <div> মেলেটের সমস্ত সমস্তকালীন <p> মেলেট নির্বাচন করে:

উদাহরণ

div ~ p {
  background-color: yellow;
}

আপনার নিজেই প্রয়োগ করুন

সকল CSS কম্বিনেশন পছন্দকারী

পছন্দকারী উদাহরণ উদাহরণ বর্ণনা
element element div p সকল <div> মেলেটের ভিতরের সকল <p> মেলেট নির্বাচন করুন。
element>element div > p div ইলিমেন্টের পারিবারিক ইলিমেন্ট হওয়া সব প <p> ইলিমেন্ট নির্বাচন করুন
element+element div + p div ইলিমেন্টের পরের <p> ইলিমেন্ট নির্বাচন করুন
element1~element2 p ~ ul প্রত্যেক <ul> ইলিমেন্টের আগের <p> ইলিমেন্ট নির্বাচন করুন যার প্রথম ইলিমেন্ট <p> হয়

সম্প্রসারিত পড়া

অতিরিক্ত বইঃCSS দশকীয় সিলেক্টর

অতিরিক্ত বইঃCSS সাব-এলিমেন্ট সিলেক্টর

অতিরিক্ত বইঃCSS আপস্ট্রেট ভাইনিয়ার সিলেক্টর