button样式

按钮（button）的样式可以通过CSS来定义，以适应网页或应用的设计需求。以下是一些常见的按钮样式示例：

基本按钮样式：

.button {

  padding: 10px 20px;

  background-color: #3498db;

  color: #fff;

  border: none;

  border-radius: 5px;

  cursor: pointer;

}

悬停效果：

.button:hover {

  background-color: #45a049;

}

按钮按下效果：

.button:active {

  background-color: #2980b9;

}

禁用状态：

.button:disabled {

  background-color: #ccc;

  color: #666;

  cursor: not-allowed;

}

圆形按钮：

.circle-button {

  width: 50px;

  height: 50px;

  background-color: #3498db;

  color: #fff;

  border: none;

  border-radius: 50%;

  cursor: pointer;

}

边框按钮：

.border-button {

  padding: 10px 20px;

  background: transparent;

  color: #3498db;

  border: 2px solid #3498db;

  border-radius: 5px;

  cursor: pointer;

}

这些只是一些基本的按钮样式示例，你可以根据自己的需求进一步自定义按钮的样式，包括字体、大小、边框、阴影、渐变等等。使用HTML的class属性，你可以将这些样式应用于特定的按钮元素，例如：

<button class="button">普通按钮</button>

<button class="circle-button">圆形按钮</button>

<button class="border-button">边框按钮</button>

<button class="button" disabled>禁用按钮</button>

记得将上述CSS样式添加到你的样式表中，并根据需要进行修改以满足你的设计要求。