আমি কোনও উপাদানটির সমস্ত বাচ্চার জন্য কীভাবে একটি স্টাইল প্রয়োগ করব

Question 1

আমার সাথে একটি উপাদান রয়েছে class='myTestClass'। এই উপাদানগুলির সমস্ত বাচ্চাদের জন্য আমি কীভাবে CSS স্টাইল প্রয়োগ করব? আমি কেবল উপাদান বাচ্চাদের স্টাইলটি প্রয়োগ করতে চাই। এর গ্র্যান্ড বাচ্চারা নয়।

আমি ব্যবহার করতে পারে

.myTestClass > div {
  margin: 0 20px;
}

যা সমস্ত divবাচ্চার পক্ষে কাজ করে তবে আমি এমন একটি সমাধান চাই যা সমস্ত শিশুদের জন্য কাজ করে। আমি ভেবেছিলাম আমি ব্যবহার করতে পারি *, কিন্তু

.myTestClass > * {
  margin: 0 20px;
}

কাজ করে না.

সম্পাদনা করুন

.myTestClass > *নির্বাচক ফায়ারফক্স 26 এর মধ্যে নিয়ম প্রযোজ্য নয়, এবং Firebug অনুযায়ী মার্জিন জন্য অন্য কোন নিয়ম নেই। এবং এটা যদি আমি প্রতিস্থাপন কাজ করে *দিয়ে div।

Question 2

ডেভিড থমাসের মন্তব্য অনুসারে , এই শিশু উপাদানগুলির বংশধররা (সম্ভবত) সেই শিশু উপাদানগুলির জন্য নির্ধারিত বেশিরভাগ শৈলীর উত্তরাধিকারী হবেন।

আপনাকে .myTestClassকোনও উপাদানটির অভ্যন্তরে আবৃত করতে হবে এবং .wrapper * বংশধর নির্বাচক যুক্ত করে বংশধরদের কাছে শৈলীগুলি প্রয়োগ করতে হবে । তারপরে, উপাদান বাচ্চাদের নয়, শিশুদের উপাদানগুলিতে স্টাইলটি প্রয়োগ করতে .myTestClass > * শিশু নির্বাচনকারীকে যুক্ত করুন । উদাহরণস্বরূপ:

জেএসফিডাল - ডেমো

.wrapper * {
    color: blue;
    margin: 0 100px; /* Only for demo */
}
.myTestClass > * {
    color:red;
    margin: 0 20px;
}

<div class="wrapper">
    <div class="myTestClass">Text 0
        <div>Text 1</div>
        <span>Text 1</span>
        <div>Text 1
            <p>Text 2</p>
            <div>Text 2</div>
        </div>
        <p>Text 1</p>
    </div>
    <div>Text 0</div>
</div>

স্নিপেট প্রসারিত করুন

Question 3

*নির্বাচকের পরিবর্তে আপনি নির্বাচকটির :not(selector)সাথে এটি ব্যবহার করতে পারেন >এবং এমন কিছু সেট করতে পারেন যা অবশ্যই সন্তানের মতো হবে না।

সম্পাদনা: আমি ভেবেছিলাম এটি দ্রুত হবে তবে এটি আমার ভুল ছিল I অবজ্ঞা করুন।

উদাহরণ:

.container > :not(marquee){
        color:red;
    }


<div class="container">
    <p></p>
    <span></span>
<div>