📌  相关文章
📜  纯 CSS 下拉菜单

📅  最后修改于: 2022-05-13 01:56:19.447000             🧑  作者: Mango

纯 CSS 下拉菜单

纯 CSS 是一个 CSS 框架。它是一个免费的开源工具集，用于创建响应式网站和 Web 应用程序。

Pure CSS 由 Yahoo 开发，用于创建更快、更美观且响应迅速的网站。它可以用作 Bootstrap 的替代品。下拉菜单是交互式网站最重要的部分之一。下拉菜单是允许用户从列表中选择值的菜单项的集合。

要在 Pure.CSS 中创建下拉菜单，我们使用类pure-menu-has-children和pure-menu-allow-hover。此类允许我们将任何元素转换为下拉项。

句法：

示例 1：以下示例显示了一个简单的下拉菜单和一个使用 CSS 的background-color属性创建的具有不同背景颜色的下拉菜单。

HTML


  

    
    
    

  

    

        

            GeeksforGeeks
        

    

  
    

        
    


  

HTML


  

    
    
    

  

    

        

            GeeksforGeeks
        

    

  
    

        
    


  

输出：

纯 CSS

示例 2：我们可以通过将下拉组件相互嵌套来创建嵌套下拉列表。

HTML 



  

    
    
    

  

    

        

            GeeksforGeeks
        

    

  
    

        
    


  

输出：

参考： https://purecss.io/menus/