How to Create a Text Input Using HTML

Last Updated: September 3, 2020

HTML forms are what you need for getting user input. But first, you need to make a text box! Here is a simple tutorial on how to make a text box if you're using Windows.

Sample Code

Sample HTML Text Input

Method 1

Method 1 of 1:

Creating a Text Input Using HTML

1
Create an HTML page. To do that, open up Notepad or any other plain text editor. On Windows, you can access Notepad via the Start Menu, at: "Accessories", then "Notepad". Or, use the Windows key + R, then type notepad and press enter.
2
Put in the code. Write the normal tags (<html><head></head><body></body></html>), and it should look like:

Advertisement
3
Now that you have the base code, you're ready to make a form to hold the text box and then make the text box.
- Between the two body tags, (<body> and </body>), type: <form name="test">.
- Next the actual input element, type: <input type="text" name="textie">.
- Finally, close the form tag, type: </form>.
4
Save the page. Click "File", "Save As", and then save it as test.html. Or, save it as anything.html.
5
Open up the window and see your new text box!
- Using JavaScript, now you could make the text box do something in conjunction with a button!
- If you want to put some text before the input box to explain what it is, do so before the <input> tag.

Community Q&A

Question

How do I resize this text box?

Nicole Futoryansky

Community Answer

You can resize the text box by using CSS. For a good CSS tutorial, you can go to FreeCodeCamp, Codecademy, or W3Schools. However, there are also some very helpful wikiHow articles.
Question

How do I make a text box mandatory?

Vinod Kumar

Community Answer

You can write required="true" / required="required" instead of required.