HTML input type url Tutorial

In this section, we will learn what <input type = “url”> element is and how to use it.

What is input type url in HTML?

The <input type =”url”> element is used to create a field where users can enter an absolute URL!

The correct format for such field is: Protocol://host-address

For example: => here the protocol is https, and the host address is:

The <input> element of type “url” automatically checks the input value and if it doesn’t match the pattern of a URL, browsers automatically display an error message which explain that the input value is not correct.

Note: because users might not know what the actual pattern of a URL is, it is recommended to use the placeholder attribute with an input of type URL to set an example for the target field so that users know what the correct pattern is.

HTML input type url Syntax:

<input type = “url>

Example: using <input type=”url”> in HTML

See the Pen using <input type="url"> in HTML by Omid Dehghan (@odehghan) on CodePen.

Leave a Reply