HTML Input Tags

HTML Input Tags

The input fields come in several flavors including check boxes, text fields, radio, and the buttons on the submission form. The tag requires no closing tag and is therefore an all-in-one "tag.

HTML - The Type Attribute

To specify one type of input tag from another they set the type attribute to one of the following values.

• "text"
• "password"
• "checkbox"
• "radio"
• "submit"
• "reset"

HTML - Text Fields and Password Fields

You have seen many of these types of input forms throughout the internet.

HTML Code:

<input type="text" />

<input type="password" />

Text Fields and Passwords:

Checkboxes permit the user to select multiple choices for a single query. A type of "check all that apply" query is best answered using a checkbox.

HTML Code:

<input type="checkbox" />

<input type="checkbox" /><input type="checkbox" />

Checkboxes:

Radios are best used in "multiple choice" type quizzes & questionaires. Where the user is only allowed to select three answer to a query.

HTML Code:

<input type="radio" />

<input type="radio" /><input type="radio" />

Radios:

HTML - Submit Buttons

Setting an input type "submit" button specifies a badge. When pressed, the button activates the action of whatever form. Most times it is some kind of server-side script file or a JavaScript function.

Because they are filing creatting a button. They should introduce a new attribute, the value attribute. Anyword (s) specified as the value is shown on our button. Often it is better to stick with "Send" or "Continue". Boring, but effective.

HTML Code:

<input type="submit" value="Submit" />

<input type="submit" value="Continue Please!" />

Submit Buttons:

HTML - Reset Buttons

The last type of input is the reset button. Return type settings place a button on your form to reset by clicking in each field. Users enjoy having a "new start" button and the reset button if you start filling out the misinformation in a major way.

HTML Code:

<input type="reset" value="Reset Fields" />

<input type="reset" value="Start Over" />

Reset Buttons: