How to style a disabled checkbox?

Question

Do you know how I could style a checkbox when it is disabled?

E.g.:

Answer 1

You can select it using css like this:

input[disabled] { /* css attributes */ }

Answer 2

Checkboxes (radio buttons and <select>) are OS-level components, not browser-level. You cannot reliably style them in a manner that will be consistent across browsers and operating systems.

Your best bet it to put an overlay on top and style that instead.

Answer 3

Use CSS's :disabled selector (for CSS3):

checkbox-style { }
checkbox-style:disabled { }

Or you need to use javascript to alter the style based on when you enable/disable it (Assuming it is being enabled/disabled based on your question).