在网站设计中，按钮是一个非常重要的元素。通过合适的按钮样式，我们可以让用户更容易地理解网站的功能和操作方式。CSS样式可以为我们提供各种各样的按钮样式选择。以下是一些常见的按钮样式：

.button {
display: inline-block;
padding: 10px 20px;
font-size: 16px;
line-height: 1.5;
border-radius: 5px;
background: #3d3d3d;
color: #fff;
}
.button:hover {
background: #555;
}
.button-primary {
background: #007bff;
}
.button-primary:hover{
background: #0069d9;
}
.button-outline {
background: transparent;
border: 1px solid #3d3d3d;
color: #3d3d3d;
}
.button-outline:hover {
background: #3d3d3d;
color: #fff;
}
.button-link {
color: #3d3d3d;
text-decoration:none;
}
.button-link:hover {
color: #007bff;
}

上述样式包含了常见的基本按钮样式、主要按钮样式、轮廓按钮样式、链接按钮样式等。其中，常见的基本按钮样式为具有圆角和背景色的按钮，并在鼠标悬停时改变背景颜色。

主要按钮样式为特别强调重要功能的按钮，一般使用鲜明的颜色和背景，同时在悬停时改变背景颜色以吸引用户的注意力。轮廓按钮样式与基本按钮类似，但没有背景颜色，只有边框和文字颜色。

链接按钮样式主要用于文字链接，不带边框和背景色，仅改变文字颜色。这样做可以让按钮看起来更加简洁、文本化。

通过这些常见的按钮样式，我们可以轻松设计出漂亮的按钮，以提升网站的用户体验。