” উপাদান, তাহলে আমরা শিশুটিকে ধরে রেখে মূল উপাদানটির স্টাইলিং সামঞ্জস্য করতে পারি। এই উদ্দেশ্যে, আমরা ব্যবহার করতে পারি ' :has() 'নির্বাচক।

উভয় '

' উপাদান থেকে, '

' উপাদান রয়েছে এমন একটি নির্বাচন করুন ' .class-name:has(শিশু-নাম) ”:

পিতা-মাতা-বিভাগ : আছে ( h1 ) {

পেছনের রং : #103e6d ;

রঙ : seashell ;

প্রস্থ : 150px ;

উচ্চতা : 150px ;

সীমানা-ব্যাসার্ধ : পঞ্চাশ% ;

পাঠ্য-সারিবদ্ধ : কেন্দ্র ;

}

এখানে, আমরা মূল উপাদানে নিম্নলিখিত CSS বৈশিষ্ট্যগুলি প্রয়োগ করেছি:

---

---

• ' পেছনের রং ” উপাদানটির পটভূমির রঙ নির্দিষ্ট করতে ব্যবহৃত হয়।
• ' রঙ ” উপাদান পাঠ্য রঙ নির্দিষ্ট করে।
• ' প্রস্থ ” উপাদানের প্রস্থ নির্ধারণ করতে ব্যবহৃত হয়।
• ' উচ্চতা ” উপাদানটির উচ্চতা নির্দিষ্ট করে।
• ' সীমানা-ব্যাসার্ধ উপাদানটির বৃত্তাকার কোণগুলি সেট করতে সম্পত্তি ব্যবহার করা হয়।
• ' পাঠ্য-সারিবদ্ধ ” পাঠ্য প্রান্তিককরণ নির্দিষ্ট করে।

আউটপুট

সব শিশু উপাদান নির্বাচন কিভাবে?

অভিভাবক নির্বাচকের সাহায্যে শিশু উপাদান নির্বাচন করতে, প্রদত্ত উদাহরণটি দেখুন।

উদাহরণ

একটি HTML পৃষ্ঠা তৈরি করতে নিম্নলিখিত পদক্ষেপগুলি প্রয়োগ করুন:

• একটি ডিভ উপাদান যোগ করুন যাতে দুটি '

  ' ট্যাগ এবং একটি '

  ' ক্লাস থাকার ট্যাগ ' শিশু-বিভাগ ”
• শিশু ' div ' উপাদানটিতে একটি '

  ' উপাদান রয়েছে:

< div ক্লাস = 'অভিভাবক-বিভাগ' >

< পি > হ্যালো < / পি >

< পি > বিশ্ব < / পি >

< div ক্লাস = 'শিশু-বিভাগ' >

< পি > আমি শিশু বিভাগ < / পি >

< / div >

< / div >

আমরা পিতামাতার মাধ্যমে শিশু উপাদান নির্বাচন করতে পারি '

'শ্রেণী। এটি শুধুমাত্র তার সরাসরি নির্বাচন করবে না ' পি ' উপাদান কিন্তু নেস্টেড নির্বাচন করে ' পি উপাদান:

পিতা-মাতা-বিভাগ পি {

পেছনের রং : #7F167F ;

ফন্ট-পরিবার : অভিশাপ ;

অক্ষরের আকার : 25px ;

পাঠ্য-সারিবদ্ধ : কেন্দ্র ;

রঙ : সাদা ধোঁয়া ;

}

আউটপুট

কিভাবে সমস্ত সরাসরি শিশুদের উপাদান নির্বাচন করবেন?

পিতামাতার ডিভের সরাসরি সন্তান নির্বাচন করতে, আমরা ব্যবহার করতে পারি ' > ' প্রতীক। এটি সমস্ত 'p' উপাদান নির্বাচন করতে সাহায্য করবে যা পিতামাতার সরাসরি সন্তান '

” উদাহরণস্বরূপ, আমরা নিম্নলিখিত CSS বৈশিষ্ট্যগুলি প্রয়োগ করেছি:

পিতা-মাতা-বিভাগ > পি {

পেছনের রং : #7F167F ;

ফন্ট-পরিবার : অভিশাপ ;

অক্ষরের আকার : 30px ;

পাঠ্য-সারিবদ্ধ : কেন্দ্র ;

রঙ : সাদা ধোঁয়া ;

}

দ্য ' ফন্ট-পরিবার 'নির্বাচিত উপাদানের ফন্ট নির্দিষ্ট করে এবং ' অক্ষরের আকার ” ফন্টের আকার নির্ধারণ করতে ব্যবহৃত হয়:

আউটপুট

আমরা HTML এবং CSS-এ CSS প্যারেন্ট সিলেক্টর সম্পর্কে আলোচনা করেছি।

উপসংহার

সিএসএস-এ, ' :has() ” নির্বাচক একটি অভিভাবক নির্বাচক ছদ্ম-শ্রেণী হিসাবে ব্যবহার করা হয়. এটি বিশেষ করে অভিভাবক উপাদান নির্বাচন করতে ব্যবহৃত হয়। এই ক্ষেত্রে, ' .parent-div:has(h1) '' সহ অভিভাবক উপাদান নির্বাচন করে

' উপাদান। পিতামাতার উপাদানের চাইল্ড উপাদান নির্বাচন করতে, ব্যবহার করুন “ পিতা-মাতা-বিভাগ পি ” শর্ত বিবৃতিটি সমস্ত সরাসরি চাইল্ড উপাদান নির্বাচন করতে ব্যবহার করা যেতে পারে। এই নিবন্ধটি উদাহরণ সহ CSS প্যারেন্ট নির্বাচককে ব্যাখ্যা করেছে।