can i change border color of checkbox by use css or jquery. i want change only border color of check box.
If you want to change the border of a checkbox, use the checkbox pseudo-class checked and specify its width, height, background, margin, and borderradius. If you want, you can also set the position to relative to make the border inside the box rather than outside.
“:hover” is used to style the checkbox when user hovers over it. Notice that when the mouse pointer move over the checkbox the color of it changes to yellow. “:active” is used to style the checkbox when it is active. Notice that when click the checkbox it will first notice a red color and then the green color.
The checkbox is an HTML element used to take input from the user. It is hard to style the checkbox, but pseudo-elements makes it easier to style a checkbox. This HTML element is generally used on every website, but without styling them, they look similar on every website.
if you want to do this with pure css, you won't get an result that works in all browsers. if you use jqueryUI there are some implementations of checkboxes like this or this. otherwise you'll have to do something similar by yourself using images.
edit:
please note: as of today (march 2015) this post is about 5 years old - back then, the IE6 still had a market share of about 10% and even the newest IE (Version 8 at that time) was crappy as hell.
This answer is technically outdated nowadays.
Checkboxes are notorious for behaving differently to styles for each browser that renders them. As Nick Craver commented, images are the only reliable way to style checkboxes safely.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With