Pure CSS Dropdown
Pure CSS is a CSS framework. It is a free and open-source tool collection for creating responsive websites and web applications.
Pure CSS is developed by Yahoo and is used for creating faster, beautiful, and responsive websites. It can be used as an alternative to Bootstrap. Dropdowns are one of the most important parts of an interactive website. A dropdown menu is the collection of menu items that allow users to choose a value from the list.
To create a dropdown menu in Pure.CSS, we use class pure-menu-has-children and pure-menu-allow-hover. This class allows us to convert any element into a dropdown item.
<div class="pure-menu-has-children pure-menu-allow-hover"></div>
Example 1: The following example shows a simple dropdown menu and a drop-down with different background colors created by using the background-color property of CSS.
Example 2: We can create a nested dropdown by nesting dropdown components inside each other.