সাস এবং সংযুক্ত শিশু নির্বাচনকারী

Question

আমি সাসকে সবেমাত্র আবিষ্কার করেছি এবং আমি এটি সম্পর্কে খুব উচ্ছ্বসিত হয়েছি

আমার ওয়েবসাইটে আমি গাছের মতো নেভিগেশন মেনু প্রয়োগ করি, শিশু সংযোজক ( E > F) ব্যবহার করে স্টাইলযুক্ত ।

সাসে আরও সহজ (বা আরও ভাল) সিনট্যাক্স সহ এই কোডটি পুনরায় লেখার কোনও উপায় আছে কি ?

#foo > ul > li > ul > li > a {
  color: red;
}

Comments

আমি মনে করি "সরল / উন্নত" ওপির অর্থ "এমনভাবে যেভাবে শ্রেণিবিন্যাস নির্দেশ করতে হোয়াইটস্পেস ব্যবহার করে"

— jsejcksn

Answer 1

সম্মিলিত শিশু বাছাইকারী ছাড়া আপনি সম্ভবত এর সাথে কিছু করতে পারেন:

foo {
  bar {
    baz {
      color: red;
    }
  }
}

আপনি যদি একই সিনট্যাক্সের সাথে পুনরায় উত্পাদন করতে চান তবে আপনি এটি করতে পারেন >:

foo {
  > bar {
    > baz {
      color: red;
    }
  }
}

এটি এটি সংকলন:

foo > bar > baz {
  color: red;
}

---

বা সাসে:

foo
  > bar
    > baz
      color: red

Comments

এটি কেবল এটি দীর্ঘ করতে চলেছে, তাই না?

— বোলটলক

আমি যদিও এটি ওপি চায়

— আর্নাড লে ব্ল্যাঙ্ক

সুন্দর ধন্যবাদ. বিটিডব্লিউ, যেমন বোল্টক্লক বলেছেন, দীর্ঘতর (এবং আমার পক্ষে কিছুটা কুরুচিপূর্ণ)। মনে হচ্ছে আমাকে আমার পুরানো স্টাইলিংয়ের সাথে থাকতে হবে।

— ফ্রেডস

আপনাকে "নিখর সিনট্যাক্স" সংজ্ঞায়িত করতে হবে;)

— আরনাড লে ব্ল্যাঙ্ক

Answer 2

আপনার কাছে থাকা একক নিয়মের জন্য এটি করার কোনও ছোট উপায় নেই। সিএসএস এবং স্যাস / এসসিএসএসে চাইল্ড কম্বিনেটর সমান এবং এর বিকল্প নেই।

তবে, যদি আপনার একাধিক নিয়ম থাকে:

#foo > ul > li > ul > li > a:nth-child(3n+1) {
    color: red;
}

#foo > ul > li > ul > li > a:nth-child(3n+2) {
    color: green;
}

#foo > ul > li > ul > li > a:nth-child(3n+3) {
    color: blue;
}

আপনি নিম্নলিখিতগুলির মধ্যে একটিকে ঘনীভূত করতে পারেন:

/* Sass */
#foo > ul > li > ul > li
    > a:nth-child(3n+1)
        color: red
    > a:nth-child(3n+2)
        color: green
    > a:nth-child(3n+3)
        color: blue

/* SCSS */
#foo > ul > li > ul > li {
    > a:nth-child(3n+1) { color: red; }
    > a:nth-child(3n+2) { color: green; }
    > a:nth-child(3n+3) { color: blue; }
}

Comments

সুতরাং সম্মিলিত শিশু নির্বাচকের জন্য কোনও রূপান্তর নেই ... সম্ভবত এর কোনও বিকল্প আছে?

— ফ্রেডস