📌  相关文章
📜  CSS按钮

📅  最后修改于: 2020-11-04 05:42:06             🧑  作者: Mango

CSS按钮

在HTML中，我们使用button标记创建按钮，但是通过使用CSS属性，我们可以为按钮设置样式。按钮可帮助我们创建用户交互和事件处理。它们是网页中广泛使用的元素之一。

在提交表单期间，为了查看或获取一些信息，我们通常使用按钮。

让我们看看按钮的基本样式。

按钮的基本样式

有多个用于设置按钮元素样式的属性。让我们一一讨论。

背景颜色

如前所述，此属性用于设置按钮元素的背景色。

句法

element {
    // background-color style
}

例

  
  
  
  
     
        button background Color 
     
      
     
 
  
  
   
The background-color property.

边框

用于设置按钮的边框。它是border-width，border-color和border-style的简写属性。

句法

element {
    // border style
}

例

  
  
  
  
     
        button background Color 
     
      
     
 
  
  
   
The border property

边框半径

它用于制作按钮的圆角。它设置按钮的边框半径。

句法

element {
    // border-radius property
}

例

  
  
  
  
     
        button background Color 
     
      
     
 
  
  
   
The border-radius property

   
Below there is the border name and border-radius

边框阴影

顾名思义，它用于创建按钮框的阴影。用于将阴影添加到按钮。我们也可以在鼠标悬停时创建阴影。

句法

box-shadow: [horizontal offset] [vertical offset] [blur radius] 
            [optional spread radius] [color];

例

  
  
  
  
     
        button background Color

填充

用于设置按钮填充。

句法

element {
    // padding style
}

让我们用插图来了解它。

例

  
  
  
  
     
        button background Color 
     
      
     
 
  
  
   
The padding property