Can a checkbox be checked by default in the stylesheet, rather than in an HTML attribute?

Question

Like the title says: can a checkbox be checked by default in the stylesheet, rather than in an inline HTML attribute?

Example from w3schools.com, the "car" box is checked:

<form action="demo_form.asp">
<input type="checkbox" name="vehicle" value="Bike"> I have a bike<br>
<input type="checkbox" name="vehicle" value="Car" checked> I have a car<br>
<input type="submit" value="Submit">
</form>

I'm making an "I agree to the Terms and Conditions" checkbox, and due to the clunky website I'm making this on, I can't create inline CSS. Instead, I can assign this field a css class, and edit the class in the larger stylesheet.

If it makes it easier, this will be the only checkbox on the page.

Solution 1

A checkbox cannot be checked in CSS, unfortunately. It relies on the checked attribute of the input element, and attributes cannot be modified via CSS.

Alternatively, you could look into a JavaScript solution, but of course the best way would be to edit the HTML directly.

Solution 2

First of all, this is not a css but a html element's attribute.

Another way to check it is with javascript, and with css you can only select it like this:

input[type=checkbox]:checked  /* select checked checkbox */
input[type=checkbox]  /* select any checkbox */