Home >
Article > Web Front-end > How can we add character width to tag in HTML?
How can we add character width to
- WBOYforward
- 2023-08-26 12:41:021395browse
In this article, we will demonstrate how to add width in characters to an input box in HTML.
The size attribute of <input> is used to specify the visible width of the <input> element, in characters. Input fields accept text, search, phone, URL, email, and password. Although somewhat indirectly, its display size may be affected. Nonetheless, the length of the expected input is not really limited by the size parameter
Syntax
The following is the syntax of
<object> ... </object>
Let’s take a look at the following example to understand how to add character width to an input box in HTML.
Example 1
In the following example, we use size=35 as the size of the input field.
<!DOCTYPE html> <html> <body> FirstName:<input type="text" value="Tutorials"><br> Lastname<input type="text" size="35" value= "Point"> </body> </html>
When the script executes, it will generate an output showing the input field with firstname as default size and lastname as size=35, as we mentioned in the script on the web page.
Example 2
Consider the following example, we have used a placeholder of size 24.
<!DOCTYPE html>
<html>
<body>
<form>
<div>
<label for="Name">Enter FullName:</label>
<input type="text" id="Name" name="Name" placeholder="All Capital Letters" size="24" />
</div>
<div>
<button>Submit</button>
</div>
</form>
</body>
</html>
After running the above script, an output will be generated on the web page containing an input field that has a placeholder of size = 24 that says "ALL CAPS", and a submit button.
Example 3
Let's consider another example where we use minimum and maximum length.
<!DOCTYPE html>
<html>
<body>
<form>
<div>
<label for="Name">Name: </label>
<input type="text" id="Name" name="Name" required size="10" minlength="4" maxlength="8" />
<span class="validity"></span>
</div>
<div>
<button>Submit</button>
</div>
</form>
</body>
</html>
After running the above script, the output window will pop up, showing the name input field with size=10, min and max attributes on the web page, and the submit button.
The above is the detailed content of How can we add character width to tag in HTML?. For more information, please follow other related articles on the PHP Chinese website!