How to use the datalist tag in HTML?

 How to use the <datalist> tag in HTML?


The HTML <datalist> tag specifies a set of options for

 <input> element. 

You need to also add an id.

 Use the <option>…<option> tag inside the

 <datalist…</datalist> tag.



How to write or use < datalist> tag in html 


<html>

   <head>

      <title>HTML Datalist Tag</title>

   </head>


   <body>

      <p>Type the tool name:</p>

      <input list = "tools" />

      <datalist id = "tools">

         <option value = "Image Editor">

         <option value = "Whiteboard">

         <option value = "Image Optimizer">

         <option value = "Document Viewer">

      </datalist>

   </body>

</html>

Location: United States

Comments

Post a Comment

Last 7 Days

How to use referrerpolicy Attribute value ( no-referrer-when-downgrade ) with < iframe > tag in HTML ? with example

How to use referrerpolicy Attribute value ( no-referrer-when-downgrade ) with < iframe > tag in HTML ? with example Referrerpolicy Attribute value ( no-referrer-when-downgrade )    in iframe Default. The referrer header will not be sent to origins without HTTPS. Example <html> <body> <h1>The iframe referrerpolicy attribute Example</h1> <iframe src="https://www.tech.thinkforu.org/"   referrerpolicy="  no-referrer-when-downgrade  "> </iframe> </body> </html>
Read more

Syntax of writing a different font style in HTML

Syntax of writing a different font style in HTML   <!DOCTYPE html> <html> <head> <style>  p.normal {   font-style: normal; } p.italic {   font-style: italic; } p.oblique {   font-style: oblique; } p.bold { font-style: bold; } p.arial { font-style: arial; } p.c ourier { font-style:  Courier; } p.helvetica { font-style: helvetica; } p.times { font-style:times; } p.trebuchet { font-style: trebuchet; } p.v erdana { font-style:verdana; } </style> </head> <body> <h1>The font-style property</h1> <p class="bold">This sentence is in bold  style .</p> <p class="normal">This sentence is in normal style.</p> <p class="italic"> This sentence is   in italic style.</p> <p class="oblique"> This sentence is  in oblique style.</p> <p class="Arial "> This sentence is  in  Arial   style .</p> <p class=" Courier "> This sente...
Read more

How to use sandbox attribute value ( allow-top-navigation) with < iframe > tag in HTML ? with example

 How to use sandbox attribute value ( allow-top-navigation) with < iframe >  tag in HTML ? with example  Sandbox attribute value ( allow-top-navigation)   Allows the iframe content to navigate its top-level browsing context. Example <html> <body> <h1>The iframe sandbox attribute Example</h1> <iframe src="tech.thinkforu.org"  sandbox="allow-scripts"> </iframe> </body> </html>
Read more

What is < table > tag in HTML?

What is table tag in HTML? The  <table> tag  defines an HTML table   Each   table row   is defined with a   <tr> tag table header  is defined with a  <th> tag  the text in  <td>  elements   are regular and left-aligned     Example of Table in Html
Read more

css for code blocks

css for code blocks // html code for blocks   <div class="au-grid">   <div class="container"> <div class="row">     <ul class="au-card-list au-card-list--matchheight">         <li class="col-sm-3 col-xs-6">             <div class="au-card au-body">             <div class="au-card__inner">                 <div class="au-card__title">                     <h3 class="au-card__title">Card 1</h3>                 </div>                 <p>Some text</p>             </div>         </div>         </li>         <li class="col-sm-3 col-xs-6"...
Read more