htmlcssformsfonts

How to change font weight of an input type=“submit” button?

I would like to change the font weight of the text in an input type=“submit button. I know to reassign text to the element we use the value attribute. but, I can’t seem to change the font weight? it’s thicker then other text. The font size at raubte works, so how do I change the font weight?

I tried:

<input type=“submit” value=“click this button”>

input[type = “submit”]{
font-weight: 50%;
}

I also tried the ::before pseudo element. I also tried using !important but didn’t work either.

Solution

  • The problem is that you're using percents instead of a numeric value or a keyword (normal or bold). If you change it to a numeric value, it works:

    input.bold {
  font-weight: 800;
}
    <input type="submit" class="bold">
<input type="submit"> <!-- for comparison -->

    See the MDN docs for supported values.