如何在页面中创建一组按钮？

在本文中，我们将学习如何在页面上创建一组按钮。这可以通过将“数据角色”属性设置为控制组来完成。

controlgroup：将多个按钮和其他小部件分组到一个视觉集中，将单一类型的多个按钮样式的输入可视化集成到一个组中。

• 数据-迷你真| false – 控制组中所有项目的紧凑型版本。
• 数据类型水平 |垂直 - 用于水平或垂直项目对齐。

句法：

    button 1
    button 2
    button 2

CDN链接：

方法：

首先，将上述 jQuery 和 JQuery UI CDN 链接添加到脚本中或下载到您的本地计算机。创建一个 DIV 标记并将 data-role 属性设置为 controlgroup。在 DIV 容器中创建 3 个锚标记并将 data-role 属性设置为按钮。

使用以下代码更改按钮的边框颜色

$("a").css("border-color", "black")

示例 1：此示例将按钮组说明为垂直列表。

HTML

  

    
    
    
    
    
    
    
    


     
        button 1 
        button 2
        button 2 
    
  
    
        $("a").css("border-color", "black")
    

  

输出：

示例 2：此示例将按钮组说明为水平列表。通过将数据类型属性设置为水平，我们可以将按钮分组为水平列表。

HTML

  

    
    
    
    
    
    
    
    

  

    
         button 1
         button 2 
         button 2 
    
  
    
        $("a").css("border-color", "black")
    

  

输出：