how to put all labels in bold with css

Question

how do I make all labels such as : first name, last name, etc in bold, by using header only? thank you

 <form>
                <fieldset class="set1">
                    <legend class="set1">Music Lover's Personal information</legend>
                    First Name
                    <input type="text" name="firstname" value=""><br><br>
                    Family Name
                    <input type="text" name="lastname" value=""><br><br>
                    Gender:
                    <input type="radio" name="gender" value="Female">Female
                    <input type="radio" name="gender" value="male">Male<br><br>
                    What age category are you from?

Solution 1

I would wrap each label in a label tag and then in CSS, with this code, you can get it:

form label {font-weight:bold}

Hope this helps you.

Solution 2

First of all , please use proper HTML for your form by defining labels:

HTML

<label for="firstname">First Name</label>

CSS:

form label{
  font-weight:bold;
}

Add any additional style to the css. You can use a class in your form if you have more than one form.

Solution 3

If you are unable to change your HTML markup and actually use labels, or spans, or other tags to wrap your labels, then you'd have to do something like:

fieldset { font-weight: bold; }
fieldset * { font-weight: normal; }