How to create a textbox in an HTML page

Input TextBox

In HTML, a textbox is an input element.

Users can type text into the textbox. The text of the textbox can be collected when the associated form is submitted to the server.

How to Create a Textbox

Create an HTML <input> element.

Add type="text" (type attribute with value text) to the <input> element. Type attribute value is set to 'text' to define the input element as a textbox.

Add name="firstName" (name attribute with value 'firstName') to define the name of the <input> element.

A label <label>First Name:</label> has been added before the input element.

Have a look at the following example:

Example of TextBox


Output of the above code example

Example of TextBox in a Webpage


Example of TextBox For Number in a Webpage

Create an HTML <input> element.

Add type="number" (type attribute with value 'number') to the <input> element. Type attribute value is set to 'number' to define the input element as a textbox for number input.

Add name="age" (name attribute with value 'age') to define the name of the <input> element.

A label <label>Age:</label> has been added before the input element.

Have a look at the following example:

Example of TextBox For Number Input


Output of the above code example

Example of TextBox For Number in a Webpage


Try to type text other than number in the above textbox.

Live Code Playground

In the following HTML code editor, you can practice the above code by more textbox input elements. Click on the 'Run Code' button to render the code; the rendered page will be displayed in the following HTML Code Output frame. Practice until you become comfortable and proficient with your code.

HTML logo HTML Online Editor
HTML Code Output