ورود

View Full Version : نحوه استایل دهی در CheckBox



mehditayebi
سه شنبه 23 دی 1393, 15:15 عصر
با سلام .
من میخواستم به چک باکس های HTML خودم استایل بدم به طوری که وقتی چک باکس من حالت انتخاب شدش بک گراند Lable کلاس lbl من هم یک رنگ خاصی بگیره .

کد مربوط به HTML به صورت زیر است :



<label> <input type='checkbox'> <span class="chk"></span> <label class="lbl"> label text </label> </label>

کد مربوط به CSS

label input {
display: none;/* <-- hide the default checkbox */
}
label span.chk {
height: 10px;
width: 10px;
border: 1px solid grey;
display: inline-block;
border-radius:5px;
}
[type=checkbox]:checked + span.chk{
background: black;
}
[type=checkbox]:checked + span.lbl {
color: red;
}


لینک ادیتور آنلاین :

http://jsfiddle.net/mehditayebi/y0rssrft/1/

ABZiko
سه شنبه 23 دی 1393, 22:17 عصر
این کار ها رو بهتره با jQuery انجام بدید، با دستور on و css !:چشمک:

mehditayebi
چهارشنبه 24 دی 1393, 08:47 صبح
این کار ها رو بهتره با jQuery انجام بدید، با دستور on و css !:چشمک:

نمونه کدی می تونید بهم بدید ؟؟

موضوع این هستش که کد Jquery اون برای زمانی که Checked شدش رو نوشتم ، حالا برای حالت Uncheck هم میخوام بنویسم .