LSS তে তাত্ক্ষণিক শিশু নির্বাচক

Question

এর আউটপুটে তাত্ক্ষণিক শিশু নির্বাচক (>) কম প্রয়োগ করার কী আছে?

আমার স্টাইলহীন.আমি কিছু লিখতে চাই:

.panel {
    ...
    > .control {
        ...
    }
}

এবং কম এমন কিছু উত্পন্ন করার জন্য:

.panel > .control { ... }

Comments

stackoverflow.com/questions/7634932/less-js-strong-nested-rules

— thirtydot

মজাদারভাবে, আপনার প্রশ্নের স্নিপেট ইতিমধ্যে সঠিক উত্তর ছিল।

— ত্রিশডট

@ ত্রিশটি ডট অবশ্যই, এটি কাজ করে না ... আপনি যদি জায়গাটি সরিয়ে না ফেলে বা "এবং" যোগ করেন না তা নয়। আমি কম.জেএস ব্যবহার করছি অন্যান্য পার্সারদের জন্য নিশ্চিত করে বলতে পারি না।

— ডেভ

আমি এটা পরীক্ষিত করেছি, এবং আপনার প্রশ্নের থেকে মূল কোড আছে less.js. কাজ নিজের জন্য দেখুন: jsfiddle.net/thirtydot/vcE8t

— ত্রিশটি

হ্যাঁ আমার ক্ষমাপ্রার্থী, এটি স্থান সহ একটি কবজির মতো কাজ করে। আপনার জন্য +1 আমি জানি না গতকাল কীভাবে এটি আমার জন্য ঘন্টাখানেক কাজ করে নি ... অন্যথায় আমি প্রশ্নটি পোস্ট না করতাম।

— ডেভ

Answer 1

হালনাগাদ

আসলে, মূল প্রশ্নের কোডটি ঠিকঠাক কাজ করে। আপনি কেবল বাছাইকারী বাছাই করতে পারেন >।

---

উত্তর খুঁজে পেয়েছি।

.panel {
    ...
    >.control {
        ...
    }
}

">" এবং "।" এর মধ্যে জায়গার অভাব নোট করুন, অন্যথায় এটি কাজ করবে না।

Comments

আমি সন্দেহ করব না যে এটি কোনও বাগ যদি সেখানে কোনও স্থানের সাথে কাজ না করে, যদি না এটি নির্দিষ্টভাবে নথিবদ্ধ থাকে।

— বোল্টক্লক

এটি কেবল পার্সারকে বোকা বানাচ্ছে। এটি এটিকে একক নির্বাচক হিসাবে দেখে তাই আপনি পান .panel >.control।

— রিকার্ডো তোমাসি

আমি এটি বাগের চেয়ে বৈশিষ্ট্য হিসাবে নিয়েছি। আপনি যখন "&" এর বিপরীতে এইভাবে ব্যবহার করেন তখন এটি অনেক বেশি সামঞ্জস্যপূর্ণ। আমি মনে করি এটি যদি আপনি সিউডো-ক্লাস এবং "শিশু ক্লাস" না দিয়ে কেবল "&" ব্যবহার করেন তবে এটি পরিষ্কার কোড code

— ডেভ

এটা তোলে CSS এর একটি বৈশিষ্ট্য, যা উভয় গ্রহণ করেন div > pএবং div>p। ধারাবাহিকতা সর্বদা নির্বাচকদের মধ্যে স্থান ব্যবহার করবে (উত্পন্ন সিএসএসে একবার দেখুন)।

— রিকার্ডো তোমাসি

অবশ্যই, তবে আমি & ব্যবহার করার ধারাবাহিকতায় আরও বেশি উদ্বিগ্ন ছিলাম।

— ডেভ

Answer 2

সরকারী উপায়:

.panel {
  & > .control {
    ...
  }
}

& সর্বদা বর্তমান নির্বাচককে বোঝায়।

Http://lesscss.org/features/#features-overview-feature-nested-rules দেখুন

Comments

আমি মনে করি এটি কেবল পার্সারকে বোকা বানাচ্ছে (যেমন আপনি অন্যান্য উত্তরটি সম্পর্কে অনুভব করেছিলেন)। আমাকে ব্যাখ্যা করতে দাও. যেমনটি আপনি বলেছেন, এবং সর্বদা বর্তমান (পিতামাতা) নির্বাচককে বোঝায়। সুতরাং তার পরে যা কিছু তা পিতামাতার জন্য প্রয়োগ করা উচিত । এবং, এটি ছদ্ম-শ্রেণীর ভূমিকা তাত্ক্ষণিক শিশু ক্লাসগুলি সিউডো-ক্লাসের পরিবর্তে **** হাঁসফাঁস **** শিশু ক্লাসের কাছাকাছি। সুতরাং ন্যায়> ব্যবহার করা আরও স্বজ্ঞাত এবং যৌক্তিক।

— ডেভ

আপনি কি আরও সঠিক মনে করেন? div > pবা div >p? &Combinator ক্যানোনিকাল পথ আমার অনুভূতি কম তা নয়, নয়। আপনার ব্যাখ্যাটি পুনর্গঠিত। কিছু লোক তাদের সিএসএস একটি একক লাইনে লিখেন ...

— রিকার্ডো তোমাসি

বেশিরভাগ লোকেরা কম ব্যবহার করেন যাতে তাদের উত্পন্ন আসল সিএসএসের যত্ন নিতে হয় না। যাইহোক, এটি প্রমাণ করে যে স্থান> পরে ব্যবহার করা যেতে পারে। সুতরাং & নিখুঁতভাবে অপ্রয়োজনীয়।

— ডেভ

Answer 3

'&' ব্যবহার করার সময় সঠিক বাক্য গঠন অনুসরণ করা হবে এখানে অপ্রয়োজনীয়।

.panel{
   > .control{
   }
}

কম দিকনির্দেশনা অনুসারে , পূর্বপুরুষদের প্যারামিটারাইজ করতে 'এবং' ব্যবহার করা হয় (তবে এখানে এরকম কোনও প্রয়োজন নেই)। ইন এই কম উদাহরণস্বরূপ , &: হোভার অপরিহার্য শেষ হয়ে গেছে : হোভার অন্যথায় এটি অন্বিত ত্রুটি স্থাপিত হবে। তবে এখানে '&' ব্যবহারের জন্য এ জাতীয় কোনও সিনট্যাকটিক প্রয়োজনীয়তা নেই। অন্যথায় সমস্ত নেস্টিংগুলিকে '&' প্রয়োজন হবে কারণ তারা মূলত পিতামাতার সাথে উল্লেখ করছে।

Comments

@ জেজেএফ কোন প্রশ্ন নেই কারণ এটি একটি উত্তর?

— বিল উডগার

Answer 4

আপনার আরও নির্বাচককে টার্গেট করতে হবে:

.parent {
    >.first-child,
    >.second-child,
    >.third-child {
    ...
    }
}

Answer 5

এছাড়াও, আপনি এই ধরনের প্রথম হিসাবে প্রথম সন্তান উপাদান লক্ষ্য করে হয় <td>একটি এর <tr>, আপনি ভালো কিছু ব্যবহার করতে পারে:

tr {
    & > td:first-child {font-weight:bold;}
}

এটি শ্রেণীর ঘোষণাকে হ্রাস করতে সহায়তা করে যখন তাদের প্রয়োজন হয় না।