If you want to show some suggestions when the user type in something, you can use datalist
Few things to note:
id
in datalist
should be same as list
in input
autocomplete
to off
to not show the history typingdata-value
to send to the server. (if using JavaScript)<body>
<form>
<input type="text" list="countries" autocomplete="off" />
<datalist id="countries">
<option data-value="1">Australia</option>
<option>Canada</option>
<option>India</option>
<option>United States</option>
</datalist>
</form>
</body>
However, if you want to style your data lists, you have to use JavaScript. We will study this later.