সিএসএস শেষ সন্তানের (-1)

Question

আমি এমন সিএসএস নির্বাচকের সন্ধান করছি যা আমাকে তালিকার প্রাক-শেষ সন্তান নির্বাচন করতে দেয় lets

<ul>
     <li>1</li>
     <li>2</li>
     <li>3</li>
     <li>4</li>
     <li>5</li> <!-- select the pre last item dynamically no matter how long this list is -->
     <li>6</li>
</ul>

স্থির পদ্ধতি:

ul li:nth-child(5)

গতিশীল পদ্ধতি:

ul li:last-child(-1)

কোনটি অবশ্যই বৈধ নয়, নবম-শেষ-সন্তানেরও কোনও গতিশীল উপায় সরবরাহ বলে মনে হচ্ছে না .. আমি জাভাস্ক্রিপ্টে ফ্যালব্যাক করতে পারি তবে আমি অবাক হচ্ছি এমন কোনও সিএসএস উপায় আছে কিনা তা আমি ভাবছি

Comments

একে সাধারণত "দ্বিতীয় শেষ" বলা হয়। এর জন্য আরও একটি অভিনব শব্দ রয়েছে: "পেনাল্টিমেট"।

— বোল্টক্লক

@ বল্টক্লক আমি "পেনাল্টিমেট" শব্দটি পছন্দ করি। আমি এখন এটি একটি স্পর্শকাতর ফেসবুক আপডেটে ব্যবহার করতে যাচ্ছি।

— অ্যান্ড্রু বারবার

CSS এর সাথে দ্বিতীয় শেষ উপাদানটি নির্বাচন করার

— কাস্ত্রো রায়

পেনাল্টিমেট উল্লেখ করার জন্য প্রত্যেককে ধন্যবাদ - এটি "সিএসএস পেনাল্টিমেট" এর জন্য গুগলে # 1 দেখিয়েছে।

— চকদা

Answer 1

আপনি ব্যবহার করতে পারেন :nth-last-child(); আসলে, আপনি ছাড়া :nth-last-of-type()আর কী ব্যবহার করতে পারেন তা আমি জানি না। আপনি "ডায়নামিক" বলতে কী বুঝছেন তা আমি নিশ্চিত নই, তবে আরও শিশুদের তালিকায় যুক্ত হওয়ার পরে শৈলীটি নতুন দ্বিতীয় শেষ সন্তানের ক্ষেত্রে প্রযোজ্য কিনা তা হ'ল এটি হ'ল। ইন্টারেক্টিভ মজার

ul li:nth-last-child(2)

Comments

ঠিক আছে যে কাজ করে! কোড ইন্টারফেসেটর (জেএসফিডাল) এটিকে বৈধতা দেয় নি .. তাদের পাশে কোনও বাগ অনুমান করুন! ধন্যবাদ

— হেডে ভ্যান ডের হাইড

@David অ্যালেন: আমি মনে করি না তিনি বজায় রাখে যদি তিনি ইতিমধ্যেই ব্যবহার করার চেষ্টা করছে না :nth-child(5)এবং :last-child। এর মতো মন্তব্যগুলি হয় প্রশ্নে চলে যাওয়া উচিত বা নিজের কাছে রাখা উচিত।

— বোল্টক্লক

কোনও সমর্থন ইস্যু সম্পর্কে তিনি জানেন না। আমি কেবল এটি হাইলাইট করছি .... আমি jQuery ব্যবহার করে একটি উত্তর দিয়েছি এবং আমি খুশি বলতে পারি যে এটি জাভাস্ক্রিপ্ট অক্ষম ব্যবহারকারীদের সাথে কাজ করবে না। তবে বেশি লোকেরা জেএস অক্ষম হওয়ার চেয়ে আই 7/8 ব্যবহার করে

— ডেভিড অ্যালেন

@ ডেভিড, আমি বিশ্বাস করি সেলেকটিভ্রজ বা মডার্নিজার প্লাগইন এই সমস্যাটি সমাধান করতে পারে, আমাকে

— ডক্সটি

@ আর্টসকোয়ার্স গ্রেট কমেন্টস কখনও সেলেকটিভিজারের কথা শুনেনি। এটি নবম-শেষ-সন্তানের সমর্থন করে কিনা তা আমাদের জানান

— ডেভিড অ্যালেন

Answer 2

আপনি যদি ক্লাসের সাথে এলিমেন্টটি লেবেল করতে PHP না পান তবে আপনি jQuery ব্যবহার করা ভাল to

jQuery(document).ready(function () {
  $count =  jQuery("ul li").size() - 1;
  alert($count);
  jQuery("ul li:nth-child("+$count+")").css("color","red");
});

Comments

এটি সম্পূর্ণ বিরক্তিকর যে jQuery বাস্তবায়িত হয় না :nth-last-child()কারণ জন মনে করে যে কেউ এটি ব্যবহার করে না ।

— বোল্টক্লক

আমি বরং অজগর দিয়ে লেবেল করব ;-) অনটপিক: ওয়েল সিএসএস এইভাবে ভাল বলে মনে হচ্ছে, সম্ভবত জেএসফিডাল মনে করে কেউ এটিকে ব্যবহার করে না :-)

— হেডে ভ্যান ডের হাইড

@ আর্গসকোয়ার্গস: আশ্চর্যজনক কেন এটি জেএসফিডেলে কাজ করবে না। এটি ব্যাখ্যা করার জন্য এটি ব্রাউজারের উপর নির্ভর করে; এটির নিজস্ব সিএসএস ইঞ্জিন নেই।

— BoltClock

@ বল্টক্লক আমাকে ভুল করে না এটি কাজ করে না, কোড সহায়ক (রঙের দৃশ্যায়ন) কেবল কিছু

— আবদ্ধ

আমি মনে করি না যে কোনও কোডই বন্ধ নেই। তবে আমি জানি "রঙের চাক্ষুষ" সম্পর্কে আপনি কী বোঝাতে চেয়েছেন

— ডেভিড অ্যালেন