CSS Forms

CSS Styling Forms

CSS is used to style HTML forms. The look of an HTML form can be greatly improved with CSS:

<form action="/action_page.php" class="test"> <label for="fname">First Name</label> <input type="text" id="fname" name="firstname" placeholder="Your name..">

<label for="lname">Last Name</label> <input type="text" id="lname" name="lastname" placeholder="Your last name..">

<label for="country">Country</label> <select id="country" name="country"> <option value="usa">Australia</option> <option value="usa">Canada</option> <option value="usa">USA</option> </select>

</form>

Styling Form Input Fields

With CSS, you can style most of the different input types, like text fields, password fields, checkboxes, radio buttons, and file inputs. You can also style input labels and form buttons.

Some commonly used CSS properties for styling input fields, are:

• width

• padding

• margin

• border

• border-radius

• background-color

• color

• font-size