সংশ্লিষ্ট চেকবক্সটি চেক করা হলে সেখানে কোনও লেবেলের রঙ পরিবর্তন করার জন্য অ জাভাস্ক্রিপ্টের কোনও উপায় আছে?
সংশ্লিষ্ট চেকবক্সটি চেক করা হলে সেখানে কোনও লেবেলের রঙ পরিবর্তন করার জন্য অ জাভাস্ক্রিপ্টের কোনও উপায় আছে?
উত্তর:
যদি তোমার থাকে
<div>
<input type="checkbox" class="check-with-label" id="idinput" />
<label class="label-for-check" for="idinput">My Label</label>
</div>
আপনি করতে পারেন
.check-with-label:checked + .label-for-check {
font-weight: bold;
}
এই কাজ দেখুন । নোট করুন যে এটি অ-আধুনিক ব্রাউজারগুলিতে কাজ করবে না।
:checkedনির্বাচক উভয়ই IE9 তে সমর্থিত হিসাবে তালিকাভুক্ত। মাইক্রোসফ্টরের নিজস্ব ডক্স এটি নিশ্চিত করে।
<label>যা কাঙ্ক্ষিতের চেয়ে অনেক বেশি মেলানো শেষ করতে পারে ।
আমি অ্যান্ড্রুয়ের পরামর্শটি পছন্দ করি এবং আসলে সিএসএসের নিয়মটি হওয়া দরকার:
:checked + label {
font-weight: bold;
}
আমি labelএবং inputউপাদানটির অন্তর্নিহিত সংযুক্তির উপর নির্ভর করতে চাই, তাই আমি এরকম কিছু করব:
<label>
<input type="checkbox"/>
<span>Bah</span>
</label>
সিএসএস সহ:
:checked + span {
font-weight: bold;
}
:checked { box-shadow: 0 0 0 500px orange; }। যে কোনও ভাইবোন উপাদান লুকিয়ে নেই তা নিশ্চিত করতে আপনাকে জেড-ইনডেক্সের সাথে খেলতে হবে।
:checkedফর্মগুলি আরও অ্যাক্সেসযোগ্য করার জন্য এটি ছদ্ম-শ্রেণীর ব্যবহারের একটি উদাহরণ । :checkedসিউডো-বর্গ যেমন ইমেজ গ্যালারী যেমন ইন্টারেক্টিভ উইজেট, গড়ে তুলতে গোপন ইনপুট এবং তাদের প্রোফাইল লেবেল সহ ব্যবহার করা যাবে। আমি লোকদের জন্য স্নিপড তৈরি করেছি যা পরীক্ষা করতে চায়।
input[type=checkbox] + label {
color: #ccc;
font-style: italic;
}
input[type=checkbox]:checked + label {
color: #f00;
font-style: normal;
}
<input type="checkbox" id="cb_name" name="cb_name">
<label for="cb_name">CSS is Awesome</label>
আপনি একা সিএসএস দিয়ে এটি করতে পারবেন না। আপনি করতে পারেন jQuery ব্যবহার করে
এইচটিএমএল
<label id="lab">Checkbox</label>
<input id="check" type="checkbox" />
সিএসএস
.highlight{
background:yellow;
}
jQuery এর
$('#check').click(function(){
$('#lab').toggleClass('highlight')
})
এটি সমস্ত ব্রাউজারে কাজ করবে
:checkedছদ্ম নির্বাচকটি CSS3 বৈশিষ্ট্য।