HTML Text Input
This page is about HTML text input. It is about how to enable your website visitors to input text within your web page.
To create an HTML text input field, you use the HTML <input>
tag. You add type="text"
in order to make it a text field. This is because the <input>
tag can be used for other types of input too - such as a submit button.
Example Text Input Field:
Example:
The above code consists of a <form>
tag containing two <input>
fields: Two text input fields and one submit button. It also contains a break (<br />) after the first text input field (First name), so that the second input field (Last name) starts on a new line.
Multiple Lines of Text
The <input>
tag isn't the only way of creating an HTML text input field. In fact, if you want your users to enter multiple lines of text, you should use the <textarea>
tag.
The <textarea>
tag is a specialized tag to allow multiple lines of text input.
Example:
The "Action" Page
The above code assumes that there's an "action page" to process the contents of the form. In this example, "action.php" is the server-side script that processes the form.
Action pages usually require some scripting knowledge to build, however, there are also plenty of free scripts available on the web.
Here's a form to email script that you can use for free. This page provides you with all the code you need to create a feedback form.
Further Details
This info aims to help you understand the above code, which consists mainly of HTML tags (or HTML elements).
The form tags contain other tags nested within them. These other tags define the actual form elements that appear within the form - such as the text area fields and the submit button.
You can use the following template as a basis for your HTML text input. Simply fill in the blanks or remove uneeded attributes.
1. The <form>
Tag
For an explanation of all the attributes, see the HTML <form> tag specifications.
2. The <textarea>
Tag
This tag defines the comment box within the form.
For an explanation of all the attributes, see the HTML <textarea> tag specifications.
3. The <input>
Tag
This tag defines the input fields within the form. Input fields can consist of text, check boxes, radio buttons, submit buttons, and more.
For an explanation of all the attributes, see the HTML <input> tag specifications.
HTML Reference
-
HTML Tutorial
Free HTML tutorial that explains how to code in HTML.
This tutorial explains what HTML elements and attributes are, and how to use them.
I explain the basics, such as what you need in order to write HTML and how to create your first web page.
I then cover other HTML topics including tables, adding color, images, forms, image maps, iframes, meta tags, and more.
I also explain the difference between HTML and CSS (and when to use each one).
Go to HTML Tutorial -
HTML Tags
Full list of all HTML elements.
This is an alphabetical list of HTML elements, linking to a full page of details for each element.
All elements are based on the official HTML5 specification, and include usage notes, full attribute list, as well as links to the various specifications for each element (i.e. HTML4 spec, HTML5 spec, WHATWG spec).
Go to HTML Tags -
CSS Properties
Full list of CSS properties.
Alphabetical list of CSS properties as per the W3C specifications.
CSS stands for Cascading Style Sheets. CSS is the standard way to style web pages.
You can use CSS to set the style for a whole website in one place. CSS allows you to set colors, fonts, widths, heights, margins, padding, and much more.
Go to CSS Properties