单选按钮,选择图片添加样式

单选按钮并选择如何添加样式,如何更改按钮在这个问题上,这里是一个朋友的例子,你需要看看




直到看到别人问,单选按钮并选择如何添加样式,如何更改按钮下面是我做过的一个例子。

1。先把这个按钮画一张


2.html页

复制代码代码如下所示:






$(函数(){())
$(输入{类型= 'checkbox})。Click(function(){)
如果($(this))是(已检查){
$(这)。Attr(查看
$(这)。父()。RemoveClass(c_off)。AddClass(c_on );
其他{ }
$(这)。RemoveAttr(检查);
$(这)。父()。RemoveClass(c_on)。AddClass(c_off );
}
});
$(输入{类型=收音机})。Click(function(){)
$(输入{类型=收音机})。RemoveAttr(检查);
$(这)。Attr(查看
$(这)。父()。RemoveClass(r_off)。AddClass(r_on ),兄弟姐妹()。RemoveClass(r_on)。AddClass(r_off );
});
});




标签{
显示块;
光标:指针;
行高:26px;
边距:20px;
宽度:26px;
身高:26px;
行高:26px;
浮点数:左;
边距:6px;
}
{。收音机
18px垫上;
边境上:1px solid # 049cdb;
}
。label_check输入。label_radio输入{
右边距:5px;
}
。lblby。label_check,lblby.label_radio {。
右边距:8px;
}
。lblby。label_radio,lblby.label_check {。
背景:URL(。 / / jxc_btn图像,PNG)不重复;
}
lblby.label_check {。
背景位置:0 0px
}
lblby { label.c_on。
背景位置:0 26px;
}
lblby.label_radio {。
背景位置:0 52px;
}
lblby { label.r_on。
背景位置:0 78px;
}
。lblby.label_check输入。lblby.label_radio输入{
位置:绝对;
左:- 9999px;
}




CheckBox1


checkbox2


Radio1


radio2


radio3