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


407

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

div.dropdown, div.dropdown > * {
    color: red;
}

এই শ্রেণিটি কেবল সংজ্ঞায়িত শ্রেণীর নাম এবং সমস্ত তাত্ক্ষণিক শিশুদের উপর একটি ক্লাস ফেলে দেয়। আপনি কীভাবে, সরল উপায়ে, সমস্ত শিশু নোডকে এর মতো বাছাই করতে পারেন:

div.dropdown, 
div.dropdown > *, 
div.dropdown > * > *, 
div.dropdown > * > * > *, 
div.dropdown > * > * > * > * {
    color: red;
}

উত্তর:


621

কোনও উপাদানের সমস্ত বংশধরদের সাথে মেলে একটি সাদা স্থান ব্যবহার করুন :

div.dropdown * {
    color: red;
}

x yএক্স এর অভ্যন্তরে থাকা প্রতিটি উপাদান y এর সাথে মেলে , তবে গভীরভাবে বাসা বেঁধে তা হতে পারে - শিশু, নাতি এবং আরও অনেক কিছু।

নক্ষত্রটি *কোনও উপাদানের সাথে মেলে।

অফিসিয়াল স্পেসিফিকেশন: সিএসএস 2.1: অধ্যায় 5.5: বংশোদ্ভূত নির্বাচক


এটি কাজ করে, তবে এখন এটি অন্য সমস্ত শ্রেণিকে ওভাররাইড করে এমনকি তাদের উচ্চতর অগ্রাধিকার থাকলেও .. (সেগুলি পরে সিএসএস ফাইলে স্থাপন করা হয়)
— ক্লার্ক

নির্বাচকও সেই বৈশিষ্ট্যটির কী অগ্রাধিকার রয়েছে সে ক্ষেত্রেও ভূমিকা রাখে, কেবল ফাইলটিতে প্রদর্শিত হয় না। আপনি আপনার মানগুলিতে "গুরুত্বপূর্ণ" যুক্ত করার চেষ্টা করতে পারেন, উদাহরণস্বরূপcolor: red !important;
— 5:38

আমি জানি, এটি কিছুটা কুরুচিপূর্ণ। আপনি পরিবর্তে আরও সুনির্দিষ্ট নির্বাচক লেখার চেষ্টা করতে পারেন, সম্ভাবনা রয়েছে, এটি খুব কার্যকর হবে। (যেমন #head ul→ #head ul#navi)
— anroesti

2
ঠিক আছে, খুব মৌলিক উদাহরণ: এর p.xyচেয়ে বেশি গুরুত্বপূর্ণ p, কারণ এটি একধরণের আরও নির্দিষ্ট। jsfiddle.net/ftJVX
— anroesti

1
আমি যদি এমন সব শিশুকে চাই যেখানে একটি নির্দিষ্ট বর্গ ছিল?
— এমইএম

144

নিয়মটি নিম্নরূপ:

A B 

এ এর বংশধর হিসাবে খ

A > B 

এ এর সন্তান হিসাবে খ

সুতরাং

div.dropdown *

এবং না

div.dropdown > *
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.