Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Form Fields | Advanced Concepts
Introduction to HTML
course content

Course Content

Introduction to HTML

Form Fields

Text fields allow users to enter a single line of text.

html

index

css

index

js

index

  • The label element is used to provide a label for the text field;
  • The input element is used to create the text field;
  • The type attribute specifies that this is a text field. You can set type="date", type="number" etc.;
  • The id and name attributes uniquely identify the field.

Radio buttons allow users to select a single option from a list of options.

html

index

css

index

js

index

The value attribute specifies the value submitted with the form when a particular radio button is selected.

textarea elements allow users to enter multiple lines of text.

html

index

css

index

js

index

This textarea element would be displayed on the web page as a blank field where the user can type in a message. The rows and cols attributes are used to specify the size of the textarea in terms of the number of rows and columns.

Task

  1. Add a "name" field, which should be a simple text field (type="text").
  2. Add a <label> field for the "email" text field below.
  3. Fill in the radio button below, similar to the one done above for the male option.
  4. Create a radio button for the option "other" below, similar to the one done above for the female option. Also, add a <label>.
  5. Add a submit button here.

Everything was clear?

Section 5. Chapter 4
We're sorry to hear that something went wrong. What happened?
some-alt