HTML Datalist

The HTML datalist tag refers a list of pre-defined options for an <input> element.

       
<datalist id=" frameworks">
  <option value="Bulma">
  <option value="Tailwind">
  <option value="Bootstrap">
  <option value="Foundation">
  <option value="Pure">
</datalist>

   
  

To create a data list for an <input> element assign data list id value to the list attribute of the input element.

    
 <input name="frameworks" list="frameworks" >

General Syntax

      
        <datalist id="frameworks">
  <option value="Bulma"> </option>
</datalist>
<input name="frameworks" list="frameworks" />

Try it now

Source Code

          
            <datalist id="frameworks">
  <option value="Bulma"> </option>
  <option value="Tailwind"> </option>
  <option value="Bootstrap"> </option>
  <option value="Foundation"> </option>
  <option value="Pure"> </option>
</datalist>
<label>CSS Framework</label>
<input name="frameworks" list="frameworks" />

Try it now

Source Code : Output

CSS Framework

Web Tutorials

Html Tutorial HTML

Javascript Tutorial JAVASCRIPT

Css Tutorial CSS

Bootstrap 5 Tutorial BOOTSTRAP 5

Bootstrap 4 Tutorial BOOTSTRAP 4