VOOZH about

URL: https://www.geeksforgeeks.org/css/w3-css-dropdown/

⇱ W3.CSS Dropdown - GeeksforGeeks


  • Courses
  • Tutorials
  • Interview Prep

W3.CSS Dropdown

Last Updated : 2 Mar, 2021

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. W3.CSS also provides classes to make a smooth and responsive dropdown menu. There are two types of dropdown menu available i.e. hoverable and clickable. The classes available for dropdown are as follows:

Sr. No.

Class Name

Description

1.

w3-dropdown-content 

It is used to make the content of the dropdown menu.

2.

w3-dropdown-hover

It is used to make a hoverable dropdown element.

3.

w3-dropdown-click

It is used to make a clickable dropdown menu.

Example: Creating a hoverable dropdown menu.

Output:

  • Before Hover:
👁 Image
  • After Hover:
👁 Image

Example: Creating a clickable dropdown menu.

Output:

  • Before Click:
👁 Image
  • After Click:
👁 Image
Comment
Article Tags:
Article Tags: