CSS 大小按钮

在Web开发中，按钮是常用的交互元素之一。而按钮的大小是很容易调整的，只需要使用CSS即可。

CSS 属性

常用的调整按钮大小的CSS属性有：

• width：设置按钮的宽度。
• height：设置按钮的高度。
• padding：设置按钮内边距，调整按钮内部元素与边框的距离。
• font-size：设置按钮文字的大小。

代码示例

下面是常用的调整按钮大小的CSS示例代码：

/* 小号按钮 */
.btn-sm {
  width: 96px;
  height: 32px;
  font-size: 14px;
  padding: 6px 12px;
}

/* 中号按钮 */
.btn-md {
  width: 128px;
  height: 40px;
  font-size: 16px;
  padding: 8px 16px;
}

/* 大号按钮 */
.btn-lg {
  width: 160px;
  height: 48px;
  font-size: 18px;
  padding: 10px 20px;
}

这里我们定义了三种不同大小的按钮，分别为小号、中号和大号按钮。你可以根据实际需求，调整按钮的大小和样式。

示例效果

小号按钮：

小号按钮

中号按钮：

中号按钮

大号按钮：

大号按钮