Table of Contents
URL: https://www.progressiverobot.com/html-html5-datalist-element/
Introduction
You can give your text inputs a little boost using the <datalist> element. It's a bit like a blend of <input> and <select>. This article will outline how to use it.
Prerequisites
- A general knowledge of HTML5. For a comprehensive review of the HTML5 markup language, explore our series, How To Build a Website in HTML.
Using the <datalist> Element
This is how you can use the <datalist> element in your HTML5 markup:
<label for="favorite-band">Your favorite band?</label>
<input list="fish"
name="fish-choice" id="fish-choice>" />
<datalist id="fish">
<option value="Shark">
<option value="Tuna">
<option value="Ulua">
</datalist>
Conclusion
The <datalist> element is a useful feature of HTML.
For a more comprehensive review of the HTML5 markup language, explore our series, How To Build a Website in HTML.