How to use list attribute in HTML?

HTML Web Development Front End Technology

In HTML, we use the <datalist> element to specify a list of pre-defined options. This list is for an input element. The list attribute refers to this <datalist> element. HTML5 introduced the list attribute.

The list attribute refers to a <datalist> element that contains pre-defined options for an <input> element.

Example

You can try to run the following code to learn how to use the list attribute in HTML.

<!DOCTYPE html>
<html>
   <head>
      <title>HTML list attribute</title>
   </head>
   <body>
      <p>Type the tool name:</p>
      <input list = "tools" name = ”tool” />
      <datalist id = "tools">
         <option value = "Image Editor">
         <option value = "Whiteboard">
         <option value = "Image Optimizer">
         <option value = "Document Viewer">
      </datalist>
   </body>
</html>

Daniol Thomas

Published on 24-Jan-2018 07:13:58

Previous Page Print Page